/*
html {
	scroll-behavior: smooth;
}
*/

/* GLOBAL CSS - DEBUT */
body .default-title p {
	padding: 0 20px;
}
/* GLOBAL CSS - FIN */


/* TOP BAR - MOBILE : seulement "Nous joindre" à gauche, "ZONE CLIENTS" à droite */
@media (max-width: 767px) {

	.top-bar {
		height: 50px;              /* hauteur fixe de la barre */
	}

	/* on enlève les paddings qui cassent la hauteur */
	.top-bar .container {
		height: 100%;
		padding-top: 0;
		padding-bottom: 0;
	}

	/* On cache la colonne de gauche (téléphone) */
	.top-bar .top-list {
		display: none !important;
	}

	/* Colonne de droite prend toute la hauteur */
	.top-bar .top-list-right {
		height: 100%;
		padding: 0;
	}

	/* La liste devient un flex qui remplit la barre */
	.top-bar .top-list-right ul {
		display: flex !important;
		align-items: stretch;      /* les <li> prennent toute la hauteur */
		justify-content: space-between;
		margin: 0;
		padding: 0;
		list-style: none;
		height: 100%;
	}

	/* On neutralise les floats du thème et cache tout par défaut */
	.top-bar .top-list-right li {
		display: none !important;
		float: none !important;
		margin: 0;
		padding: 0;
		height: 100%;
	}

	/* On ne garde que "Nous joindre" et "ZONE CLIENTS" */
	.top-bar .top-list-right li.toplist-1,
	.top-bar .top-list-right li.account {
		display: flex !important;   /* flex pour pouvoir centrer le <a> dedans */
	}

	/* "Nous joindre" à gauche */
	.top-bar .top-list-right li.toplist-1 {
		order: 1;
		margin-right: auto;
	}

	/* "ZONE CLIENTS" à droite */
	.top-bar .top-list-right li.account {
		order: 2;
		margin-left: auto;
	}

	/* Tous les liens remplissent la hauteur de leur <li> */
	.top-bar .top-list-right li a {
		display: flex;
		align-items: center;       /* centrage vertical du texte */
		justify-content: center;
		height: 100%;
		white-space: nowrap;
		padding: 0 15px 0 15px;
	}

	/* "Nous joindre" : aligné à gauche dans son li */
	.top-bar .top-list-right li.toplist-1 {
		display: flex !important;
		align-items: center;         /* centre verticalement l’icône + texte */
		justify-content: flex-start; /* bloc vraiment collé à gauche */
		padding: 0 15px 0 15px;
	}

	/* Le lien "Nous joindre" : texte à gauche, pas centré */
	.top-bar .top-list-right li.toplist-1 a {
		justify-content: flex-start; /* texte collé à gauche dans le lien */
		padding-left: 0;
		padding-right: 0;
	}

	/* Icône FontAwesome avant "Nous joindre" : centré verticalement */
	.top-bar .top-list-right li.toplist-1::before {
		margin-right: 6px;
		font-size: 14px;    /* même taille que le texte */
		line-height: 1;
		position: relative;
		top: 1px;           /* petit ajustement fin, tu peux mettre 0 / 2px au besoin */
	}
}



/* NAVBAR - DEBUT */

.form-group {
	color: #262626;
}

@media (min-width: 1024px) {
	nav.navbar .navbar-brand img.logo {
		margin-top: 11px;
	}
	nav.navbar.sticked .navbar-brand img.logo {
		margin-top: -8px!important;
	}
}
@media (max-width: 992px) {
	nav.navbar .navbar-brand img.logo {
		margin-top: 7px;
	}
	nav.navbar.sticked .navbar-brand img.logo {
		margin-top: 5px!important;
	}
}

/* NAVBAR - FIN */

/* INDEX - DEBUT */
.boxAccueil{
	min-height: 325px!important;
}

/* HEBERGEMENT-WEB.HTML / HEBERGEMENT-WORDPRESS.HTML - DEBUT */
/* === Section pourquoi choisir rapidenet, carreaux égaux partout === */
#section-05 .row.slideinup {
	display: flex;
	flex-wrap: wrap;
	margin-left: -15px;
	margin-right: -15px;
}

#section-05 .row.slideinup > [class*="col-"] {
	float: none;            /* on neutralise les floats BS3 dans cette rangée */
	display: flex;
	margin-bottom: 20px;
}

#section-05 .section-05-box {
	display: flex;
	flex-direction: column;
	align-items: center;    /* centre horizontalement icône + titres */
	justify-content: center;/* centre verticalement le contenu dans la box */
	text-align: center;     /* centre le texte */
	width: 100%;
	padding: 0 20px;
	color: #fff;
	border-radius: 6px;
	min-height: 100%;
	-webkit-box-shadow: -1px 4px 15px -7px rgba(0, 0, 0, 0.66);
	-moz-box-shadow: -1px 4px 15px -7px rgba(0, 0, 0, 0.66);
	box-shadow: -1px 4px 15px -7px rgba(0, 0, 0, 0.66);
}

/* Icone + titres */
#section-05 .section-05-box i {
	display: inline-block;
	margin-bottom: 12px;
	line-height: 1;
}

#section-05 .section-05-box h3 {
	margin: 8px 0 10px;
	font-weight: 700;
}

#section-05 .section-05-box h4 {
	margin: 0;             /* pas de poussée vers le bas, on centre tout */
	font-weight: 400;
}

/* Mobile spacing */
@media (max-width: 767px) {
	#section-05 .section-05-box {
		margin-bottom: 15px;
	}
}


/* === Section questions et réponses - Carreaux égaux partout === */
.faq .faq-cf{
	display: flex;
	flex-wrap: wrap;
	margin-left: -15px;          /* conserver le gutter BS3 */
	margin-right: -15px;
	row-gap: 20px;               /* espace vertical entre lignes (navigateurs modernes) */
}

.faq .faq-cf > [class*="col-"]{
	float: none;                 /* neutraliser les floats dans CETTE grille */
	display: flex;               /* permet d'étirer l'enfant */
	padding-left: 15px;
	padding-right: 15px;
}

.faq .faq-cf .box{
	display: flex;
	flex-direction: column;
	width: 100%;
	padding: 20px;
	border-radius: 6px;
	color: #fff;
	box-shadow: 0 6px 16px rgba(0,0,0,.08);
	min-height: 100%;            /* étire la box à la hauteur de la colonne */
}

.faq .faq-cf .box h3{
	margin: 0 0 8px;
	font-weight: 700;
}
.faq .faq-cf .box p{
	margin: 0;
}

/* Fallback si row-gap non supporté */
@supports not (row-gap: 1px){
	.faq .faq-cf > [class*="col-"]{
		margin-bottom: 20px;
	}
}

/* Optionnel : un peu plus d’air sur mobile */
@media (max-width:767px){
	.faq .faq-cf .box{
		padding: 18px;
	}
}


/* HEBERGEMENT-WEB.HTML / HEBERGEMENT-WORDPRESS.HTML - FIN */

/* NOM DE DOMAINE - DEBUT */
/* ===== Search domain (force override du thème) ===== */

/* Desktop : input + bouton collés */
.search-bar.sb2 .input-group{
	display: flex !important;              /* remplace display:table */
	align-items: stretch !important;
	width: 100% !important;
	font-size: 0 !important;               /* élimine tout éventuel espace inline */
}
.search-bar.sb2 .input-group .form-control.bar{
	height: 56px !important;
	padding: 0 20px !important;
	border: none !important;
	border-right: 0 !important;
	box-shadow: none !important;
	border-radius: 28px 0 0 28px !important;   /* arrondi gauche */
	margin: 0 !important;
	font-size: 16px !important;                /* rétablit le texte (car parent à 0) */
	color: #fff !important;
	caret-color: #fff !important;     /* couleur du curseur */
}

/* Placeholder normal (blanc adouci) */
.search-bar.sb2 .form-control.bar::placeholder {
	color: rgba(255,255,255,.8) !important;
}
.search-bar.sb2 .form-control.bar::-webkit-input-placeholder {
	color: rgba(255,255,255,.8) !important;
}
.search-bar.sb2 .form-control.bar:-ms-input-placeholder {
	color: rgba(255,255,255,.8) !important;
}
.search-bar.sb2 .form-control.bar::-ms-input-placeholder {
	color: rgba(255,255,255,.8) !important;
}

/* Placeholder masqué au focus */
.search-bar.sb2 .form-control.bar:focus::placeholder {
	color: transparent !important;
}
.search-bar.sb2 .form-control.bar:focus::-webkit-input-placeholder {
	color: transparent !important;
}
.search-bar.sb2 .form-control.bar:focus:-ms-input-placeholder {
	color: transparent !important;
}
.search-bar.sb2 .form-control.bar:focus::-ms-input-placeholder {
	color: transparent !important;
}

.search-bar.sb2 .form-control.bar::-webkit-input-placeholder {
	color: rgba(255,255,255,.8) !important;
}
.search-bar.sb2 .form-control.bar:-ms-input-placeholder {
	color: rgba(255,255,255,.8) !important;
}
.search-bar.sb2 .form-control.bar::-ms-input-placeholder {
	color: rgba(255,255,255,.8) !important;
}

.search-bar.sb2 .input-group .input-group-btn{
	display: flex !important;
	align-items: stretch !important;
	margin-left: -1px !important;              /* colle le bouton à l’input */
	font-size: 16px !important;                /* texte normal dans le bouton */
}
.search-bar.sb2 .input-group .input-group-btn .btn{
	height: 56px !important;
	line-height: 56px !important;
	border: none !important;
	border-left: 0 !important;
	border-radius: 0 28px 28px 0 !important;   /* arrondi droit */
	margin: 0 !important;
	padding: 0 22px !important;
	white-space: nowrap !important;
	left: 0!important;
}

/* Titre / sous-titre (optionnel) */
.search-bar.sb2 .default-title h3{
	margin-bottom: 8px !important;
}
.search-bar.sb2 .default-title p {
	margin-bottom: 18px !important;
	opacity: .9 !important;
}

/* TLDs : tu es déjà en col-xs-6 — juste le style */
.search-bar.sb2 .ltds [class*="col-"]{
	text-align: center !important;
	padding: 8px 12px !important;
}
.search-bar.sb2 .ltds p{
	margin: 0 !important;
	font-weight: 700 !important;
}
.search-bar.sb2 .ltds p span{
	margin-left: 6px !important;
	font-weight: 400 !important;
	opacity: .85 !important;
}

/* Séparateurs en ≥ sm uniquement */
@media (min-width:768px){
	.search-bar.sb2 .ltds > div{
		position: relative !important;
	}
	.search-bar.sb2 .ltds > div:not(:last-child){
		border-right: 1px solid rgba(255,255,255,.35) !important;
	}
}

/* === Mobile : input AU-DESSUS, bouton EN-DESSOUS (plein largeur) === */
@media (max-width: 767px){
	.search-bar.sb2 .input-group{
		display: block !important;              /* casse la ligne BS3 */
	}
	.search-bar.sb2 .input-group .form-control.bar{
		display: block !important;
		width: 100% !important;
		border-radius: 28px !important;
		margin: 0 0 10px !important;
		float: none !important;                 /* neutralise BS */
	}
	.search-bar.sb2 .input-group .input-group-btn{
		display: block !important;
		width: 100% !important;
		margin-left: 0 !important;              /* enlève le -1px desktop */
		float: none !important;
		position: static !important;            /* annule tout positionnement du thème */
	}
	.search-bar.sb2 .input-group .input-group-btn .btn{
		display: block !important;
		width: 100% !important;
		border-radius: 28px !important;
		line-height: 56px !important;
		margin-left: 0 !important;
		left: auto !important;
	right: auto !important;
		transform: none !important;             /* au cas où */
	}
}



/* === Patch pour aligner texte correctement dans la section search domain=== */
.sb2 .default-title {
	right: 0!important;
}

/* NOM DE DOMAINE - FIN */







/* ZONE CLIENT - DEBUT */
.zone-client {
	background: url(../img/headers/bannertop-espace-client.webp) center;
	background-size: cover;
}

/* === Palette (adapte aux couleurs RapideNET) === */
:root{
	--brand: #ff5a4e;      /* accent/CTA */
	--ink: #1a1a1a;        /* texte principal */
	--muted: #6b7280;      /* texte secondaire */
	--card: #ffffff;       /* fond cartes */
	--bg: #f6f7fb;         /* fond doux sections */
}

/* Reset mineur */
body {
	color: var(--ink);
}
a {
	color: var(--brand);
	text-decoration: none;
}
a:hover {
	opacity: .9;
}

/* Grille de cartes */
.big-boxes-cloud {
	background: var(--bg);
	padding: 24px 0;
	border: none!important;
}
.big-boxes-cloud .container::after {
	content: "";
	display: block;
	clear: both;
}

.big-boxes-cloud .card {
	/*background: var(--card);*/
	border: 1px solid rgba(0,0,0,.06);
	border-radius: 14px;
	box-shadow: 0 10px 24px rgba(16,24,40,.20),
	0 15px 15px rgba(16,24,40,.30);
	transition: transform .18s ease, box-shadow .18s ease;
	will-change: transform, box-shadow; /* perf */
	padding: 18px 18px 16px;
	margin-bottom: 5px;
	min-height: 400px; /* aligne les hauteurs sur desktop */
	display: flex;
	flex-direction: column;
	justify-content: flex-start;
}
.big-boxes-cloud .card:hover{
	/*
	transform: translateY(-5px);
	box-shadow:
	0 15px 34px rgba(16,24,40,.26),
	0 20px 20px rgba(16,24,40,.38);
	*/
	box-shadow: 0 10px 24px rgba(247, 44, 37, 0.75),   /* teinte brand */
	0 15px 15px rgba(16, 24, 40, 0.20);    /* profondeur neutre */
}

.big-boxes-cloud h5 {
	font-size: 12px;
	letter-spacing: .6px;
	color: var(--muted);
	margin: 0 0 6px;
	font-weight: 700;
}
.big-boxes-cloud h4 {
	font-size: 16px;
	margin: 0 0 12px;
	font-weight: 700;
}
/* Centre toutes les images des cards */
.big-boxes-cloud .card img {
	display: block;           /* annule l'inline de base */
}
.big-boxes-cloud p {
	font-size: 14px;
	color: #444;
	margin-top: 24px;
}

/* Forms dans les cartes */
.big-boxes-cloud form {
	margin-top: auto;
} /* colle les CTAs en bas */
.big-boxes-cloud select {
	width: 100%;
	height: 42px;
	border: 1px solid #d1d5db;
	border-radius: 10px;
	padding: 0 12px;
	font-size: 14px;
	background: #fff;
	text-align: center;
}
.big-boxes-cloud .btn {
	border-radius: 10px;
	padding: 10px 14px;
	font-weight: 700;
	width: 100%;
}
.big-boxes-cloud .btn.btn-outline {
	border: none;
} /* neutralise l'ancien style */
.big-boxes-cloud .btn.btn-lg {
	font-size: 14px;
}

/* Bouton primaire */
.btn-primary, .button.btn-outline.btn-lg {
	background: var(--brand);
	border-color: var(--brand);
	color: #fff !important;
}
.btn-primary:hover, .button.btn-outline.btn-lg:hover {
	filter: brightness(.96);
}

/* Grille responsive propre (Bootstrap 3) */
@media (min-width: 768px){
	.zone-grid .col-sm-4 {
		padding: 10px;
	}
}
@media (max-width: 767px){
	.big-boxes-cloud {
		padding: 16px 0;
	}
	.big-boxes-cloud .card {
		min-height: auto;
		margin-bottom: 20px;
	}
}

/* Respecte les utilisateurs qui réduisent les animations */
@media (prefers-reduced-motion: reduce){
	.card{
		transition: box-shadow .18s ease;
	}
	.card:hover{
		transform: none;
	}
}

/* Base card pilotée par variables */
.card{
	--card-bg: #ffffff;        /* fond par défaut */
	--card-fg: #1a1a1a;        /* texte par défaut */
	--card-border: #e5e7eb;
	--card-shadow: 0 6px 18px rgba(16,24,40,.06);

	background: var(--card-bg);
	color: var(--card-fg);
	border: 1px solid var(--card-border);
	border-radius: 14px;
	box-shadow: var(--card-shadow);
	padding: 18px;
	min-height: 340px;
	display: flex;
	flex-direction: column;
}
.card h4, .card h5, .card p {
	color: inherit;
}
.card-icon{
	display: block;
	margin: 6px auto 12px;
	/*max-width: 68px;*/  /* ajuste si tu veux plus grand/petit */
	height: auto;
}
/* Hauteur standard des logos/icônes de cartes */
.card-media{
	--media-h: 100px;              /* augmente la hauteur cible (96 → 110/120…) */
	height: var(--media-h);
	display: flex;
	align-items: center;
	justify-content: center;
	margin: 6px 0 12px;
	width: 100%;
	padding: 10px;
}

/* L’image (SVG/PNG…) remplit la boîte sans déborder */
.card-media > img,
.card-media > svg{
	display: block;
	width: 100%;
	height: 100%;
	object-fit: contain;           /* garde les proportions */
	max-width: none;               /* ignore les "width" internes */
}

/* Variantes si tu veux jouer sur la taille par carte */
.card-media.media-sm {
	--media-h: 72px;
}
.card-media.media-lg {
	--media-h: 120px;
}

/* Astuce: sur fond sombre, tu as déjà des versions light; sinon tu peux forcer un filtre (optionnel) */
/* .card.is-dark .card-media img.monochrome { filter: brightness(0) invert(1); } */

/* Bouton adaptatif à la carte */
.card .btn-primary{
	--cta: var(--brand, #ff5a4e);
	background: var(--cta);
	border-color: var(--cta);
	color: #fff;
}

/* Inputs/selects : thème clair par défaut */
.card select{
	width: 100%;
	height: 42px;
	background: #fff;
	color: #111827;
	border: 1px solid #d1d5db;
	border-radius: 10px;
	padding: 0 12px;
}

/* Variante “foncée” : rend les champs sombres pour rester lisibles */
.card.is-dark{
	--card-border: rgba(255,255,255,.12);
	--card-shadow: 0 6px 18px rgba(0,0,0,.25);
	box-shadow: 0 1px 2px rgba(0, 0, 0, .20),
	0 8px 22px rgba(0, 0, 0, .28);
}
.card.is-dark:hover{
	box-shadow: 0 3px 6px rgba(0, 0, 0, .24),
	0 18px 40px rgba(0, 0, 0, .36);
}
.card.is-dark select{
	background: rgba(255,255,255,.08);
	color: #fff;
	border: 1px solid rgba(255,255,255,.18);
}
.card.elevated{
	box-shadow: 0 4px 10px rgba(16, 24, 40, .10),
	0 22px 50px rgba(16, 24, 40, .22);
}
.card.elevated:hover{
	transform: translateY(-4px);
	box-shadow: 0 8px 18px rgba(16, 24, 40, .12),
	0 28px 60px rgba(16, 24, 40, .28);
}

/* Hover */
.card:hover{
	/*
	transform: translateY(-3px);
	box-shadow: 0 10px 24px rgba(16,24,40,.10);
	*/
}

/* Variantes sombres */
.card.bg-plum     {
	--card-bg: #312333;
	--card-fg: #ffffff;
}
.card.bg-ink      {
	--card-bg: #0f172a;
	--card-fg: #e5e7eb;
}
.card.bg-slate    {
	--card-bg: #1f2937;
	--card-fg: #e5e7eb;
}
.card.bg-slate-soft{
	--card-bg: #E2E8F0;
	--card-fg: #0F172A;
	--card-border: #D1D5DB;
}
.card.bg-slate-mid{
	--card-bg: #CBD5E1;
	--card-fg: #0B1220;
	--card-border: transparent;
}
.card.bg-slate-strong{
	--card-bg: #B7C0CE;
	--card-fg: #0A0F1A;
	--card-border: transparent;
}

/* Variantes claires */
.card.bg-ash      {
	--card-bg: #f6f7fb;
	--card-fg: #111827;
}
.card.bg-ivory    {
	--card-bg: #fffffb;
	--card-fg: #111827;
}
.card.bg-brand-tint{
	--card-bg: #FFF3F2;   /* ~4–5% de #F72C25 */
	--card-fg: #0F172A;
	--card-border: #FFDAD6;
}
.card.bg-cloud{
	--card-bg: #F6F7FB;   /* gris très clair, légèrement bleuté */
	--card-fg: #0F172A;
	--card-border: #E5E7EB;
}

.card.bg-success-soft{
	--card-bg: #DFF3E8;  /* vert clair */
	--card-fg: #0F172A;  /* texte foncé lisible */
	--card-border: #CFE7DA;
}
.card.bg-success-muted{
	--card-bg: #7BBF9E;
	--card-fg: #0A0F1A;
	--card-border: transparent;
}
.card.bg-success-strong.is-dark{
	--card-bg: #198754;
	--card-fg: #FFFFFF;
	--card-border: rgba(255,255,255,.18);
}

/* Bordures plus fines sur fond foncé (optionnel) */
.card.bg-plum, .card.bg-ink, .card.bg-slate {
	--card-border: rgba(255,255,255,.14);
}

/* Nettoyage footer thème */
/*
footer .title-widget, footer .footerp, .footer-bottom .design a {
color: #cbd5e1;
}
.footer-fluid {
background: #0b1020;
color: #cbd5e1;
}
.footer-bottom {
background: #070b16;
color: #94a3b8;
}
footer p, footer li a {
color: #cbd5e1;
}
*/


/* ZONE CLIENT - FIN */


/* CONTACT - DEBUT */
.boxContact{
	min-height:200px; 
}

#contact-section1 .fa {
	color: #F72C25;
	font-size: 50px;
}
.hours-table {
	width: 100%;
	border-collapse: separate;
	border-spacing: 0 6px;
}
.hours-table td {
	vertical-align: top;
	padding: 0 0 6px 0;
}
.hours-day {
	width: 110px;
}
.is-today .hours-day {
	font-weight: 700;
}

.hours-line {
	display: block;
	line-height: 1.25;
}
.hours-line i {
	font-size: 12px;
	margin-right: 8px;
}

/* Couleurs: uniquement pour aujourd'hui */
.status-open   {
	color: #1eb45a;
	font-weight: bold;
}
.status-closed {
	color: #F26E45;
	font-weight: bold;
}
.status-neutral{
	color: inherit;
	font-weight: normal;
}
.support-card {
	border: 1px solid rgba(0,0,0,.08);
	border-radius: 12px;
	padding: 18px;
}
.support-card h4 {
	margin: 0 0 12px;
	font-weight: 700;
}
.support-hours .rowitem {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 6px 0;
	border-bottom: 1px dashed rgba(255,255,255,.06);
}
.support-hours .rowitem:last-child{
	border-bottom: none;
}
.support-hours .day {
	min-width: 95px;
}
.support-hours .channel {
	display: flex;
	gap: 12px;
	flex-wrap: wrap;
	justify-content: flex-end;
}
.badge-chan {
	font-size: .85rem;
	padding: 2px 8px;
	border-radius: 999px;
	background: rgba(255,255,255,.06);
}
.is-open  {
	color: #2ecc71;
	font-weight: 600;
}
.is-closed{
	color: #ff4d4f;
	font-weight: 600;
}
.is-today {
	font-weight: 800;
}
.services-status{
	margin-top: 16px;
	border-top: 1px solid rgba(255,255,255,.08);
	padding-top: 12px;
}
.services-status p {
	margin: 6px 0;
}
.tiny {
	font-size: .85rem;
	opacity: .85;
}
.legend {
	margin-top: 8px;
	font-size: .85rem;
}
.support-note {
	margin-top: 10px;
	border: 1px solid rgba(0, 0, 0, .08);
	border-radius: 12px;
	padding: 18px;
}
.support-note p {
	margin: 0;
}

/* Champ invalide : fond rouge pâle + bordure */
.field-error{
	background-color: #FFECEC !important;
	border-color: #E99 !important;
	transition: background-color .2s ease, border-color .2s ease;
}

.recaptcha-disclaimer{
	margin-top: 30px;
	font-size: .85rem; 
	color: #888;
}
#recaptcha-slot{
	display: flex;
	justify-content: center;   /* centre le badge */
	align-items:center;
	margin-top: 30px;          /* “décollage” du bouton */
}
.grecaptcha-badge{
	visibility: hidden !important;
	opacity: 0 !important;
	pointer-events: none !important;
}

.btn-envoyer{
	margin-top: 10px;
	width: 100%;
	border-radius: 5px!important;
	box-shadow: 0 6px 14px rgba(0,0,0,.18), 0 3px 6px rgba(0,0,0,.10);
	transition: box-shadow .2s ease, transform .08s ease, filter .2s ease;
}
.btn-envoyer:hover{
	box-shadow: 0 10px 20px rgba(0,0,0,.22), 0 6px 10px rgba(0,0,0,.12);
	transform: translateY(-1px);
	filter: saturate(1.05);
}

.btn-envoyer:active{
	box-shadow: 0 3px 6px rgba(0,0,0,.24), 0 1px 3px rgba(0,0,0,.18);
	transform: translateY(0);
}

.btn-envoyer:focus{
	outline: 0;
	/* halo adapté au jaune de .btn-warning (BS3/BS4) */
	box-shadow: 0 0 0 3px rgba(240,173,78,.35),   /* #f0ad4e (BS3) */
	0 0 0 3px rgba(255,193,7,.35),    /* #ffc107 (BS4/5) */
	0 6px 14px rgba(0,0,0,.18);
}

.btn-envoyer[disabled],
.btn-envoyer.disabled{
	box-shadow: none;
	opacity: .65;
	cursor: not-allowed;
}
/* CONTACT - FIN */


/* FOOTER -  DEBUT */
.partners img {
	opacity: 1!important;
}

/*centrer les logos*/
/* Centrer la rangée de logos du footer */
.partners{
	display: flex;
	flex-wrap: wrap;
	justify-content: center;   /* horizontal center */
	align-items: stretch;       /* vertical align of items within the row */
	gap: 18px 28px;
	padding: 14px 0;
}

/* Neutraliser les floats du grid BS3 dans cette zone pour laisser Flex gérer */
/* Cellules de logo */
.partners > [class*="col-"]{
	float: none !important;
	display: flex;
	justify-content: center;
	align-items: center;      /* centre VERTICAL aussi */
	min-height: 80px;         /* même hauteur visuelle pour toutes les cases */
	text-align: center;

	/* 4 logos par ligne en desktop */
	flex: 0 0 23%;
	max-width: 25%;
}

/* Responsive : 2 logos par ligne en mobile */
@media (max-width: 767px) {
	.partners {
		justify-content: flex-start; /* reste en grille bien alignée */
		gap: 12px 0;                 /* petit espace VERTICAL entre les lignes, 0 en horizontal */
	}

	.partners > [class*="col-"]{
		flex: 0 0 50% !important;
		max-width: 50% !important;

		/* espace HORIZONTAL entre les logos */
		padding-left: 8px;
		padding-right: 8px;
		margin-bottom: 0;   /* tu peux mettre 8–12px si tu veux plus d’espace vertical */
	}
}

/* Taille/ajustement des images */
.partners img{
	max-height: 44px;
	width: auto;
	height: auto;
	object-fit: contain;
	position: static;   /* plus de décalage vertical */
	top: auto;
	display: block;
}

/* Section contact : centrage vertical */
#contact-parts .contact-p1,
#contact-parts .contact-p2 {
	display: flex;
	align-items: center;     /* centre verticalement le h2 */
	min-height: 72px;        /* ajuste la hauteur visuelle de la barre */
}

/* Alignements horizontaux (téléphone à droite, email à gauche) */
#contact-parts .contact-p1 {
	justify-content: flex-end;
	text-align: right;
}
#contact-parts .contact-p2 {
	justify-content: flex-start;
	text-align: left;
}

/* Style commun des titres (sans float) */
#contact-parts h2 {
	margin: 0;
	font-weight: 300;
	font-size: 20px;
	text-transform: uppercase;
	padding: 0 50px 0 20px;
	/* évite les césures agressives sur les emails */
	word-break: break-word;            /* au lieu de break-all */
	overflow-wrap: anywhere;
	font-family: "Nunito Sans", sans-serif;
	color: #fff;
	float: none;                       /* IMPORTANT : retire le float */
}

/* Responsive : centre tout en mobile */
@media (max-width: 767px) {
	#contact-parts .contact-p1,
	#contact-parts .contact-p2 {
		justify-content: center;
		text-align: center;
		min-height: 56px;
	}
	#contact-parts h2 {
		padding: 10px 15px;
	}
}

#contact-parts .contact-p1 h2.headset::before{
	content: "\f590"!important;
}
/* FOOTER - FIN */




/* PRICING TABLES - DEBUT */
/* Conteneur qui empile les prix verticalement */
.price-stack {
	display: inline-flex;
	flex-direction: column;
	align-items: center;
	line-height: 1.1;
}

/* Prix régulier biffé (au-dessus) */
.price-regular {
	text-decoration: line-through;
	text-decoration-thickness: 1px;
	text-decoration-color: #ef4444;
	color: #ff6b6b;
	margin-bottom: 0px!important;
}


/* Ancienne règle du thème, on la garde mais sans padding chelou */
.pricingTable-header > .price-value {
	display: block;
	font-size: 35px;
	line-height: 50px;
	padding-top: 0 !important;
	font-weight: 800;
	color: #fff;
}

/* Bloc prix annuel : centré verticalement */
.pricingTable .pricingTable-header .price-value {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	min-height: 100px;      /* comme avant */
	line-height: 1.1;
}

/* Prix annuel régulier barré (au-dessus) */
.pricingTable .pricingTable-header .price-value .price-regular {
	display: block;
	font-size: 14px;
	font-weight: 700;
	color: #ff6b6b;
	text-decoration: line-through;
	margin-bottom: 0px!important;
}

/* Prix annuel promo (gros) */
.pricingTable .pricingTable-header .price-value .price-promo {
	display: block;
	font-size: 32px;
	font-weight: 700;
}

/* "par année" sous le prix promo */
.pricingTable .pricingTable-header .price-value .mo {
	display: block;
	font-size: 14px;
	margin-top: 0px!important;
}

/* Ligne "ou XX$ par mois" : reset du thème */
.pricingTable .pricingTable-header > p {
	margin: 5px 0 0;
}

/* Ligne "ou XX$ par mois" */
.pricingTable .pricingTable-header p .mo {
	display: inline-flex;            /* flex pour centrer le stack sur la ligne */
	align-items: center;
	justify-content: center;
	font-size: 14px;
	line-height: 1.3;
}

/* STACK DU PRIX MENSUEL */
.pricingTable .pricingTable-header p .mo .price-stack {
	display: inline-flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	margin: -8px 4px 0 4px;          /* remonte le bloc */
	line-height: 1.1;
}

/* Prix mensuel régulier barré */
.pricingTable .pricingTable-header p .mo .price-regular {
	font-size: 14px;
	color: #ff6b6b;
	text-decoration: line-through;
}

/* Prix mensuel promo */
.pricingTable .pricingTable-header p .mo .price-promo {
	font-size: 16px;
	font-weight: 700;
}

/* PRICING TABLES - FIN */


/* DEBUT SECTION SERVEURS DÉDIÉS */
/* La rangée devient flex pour permettre des cartes de hauteur égale */
#section-05 .row.slideinup {
	display: flex;
	flex-wrap: wrap;
}

/* Chaque colonne devient flex pour étirer la box à la même hauteur */
#section-05 .row.slideinup > [class*="col-"] {
	display: flex;
	margin-bottom: 30px;
}

/* La box : layout vertical, icône en haut, prix collé en bas */
.section-05-box {
	background: #fff;
	padding: 20px 20px 26px;
	border-radius: 4px;
	display: flex;
	flex-direction: column;
	width: 100%;
	-webkit-box-shadow: -1px 4px 15px -7px rgba(0, 0, 0, 0.66);
	-moz-box-shadow: -1px 4px 15px -7px rgba(0, 0, 0, 0.66);
	box-shadow: -1px 4px 15px -7px rgba(0, 0, 0, 0.66);
}

/* Icône toujours à la même distance du haut */
.section-05-box i {
	margin-bottom: 12px;
}

/* Titre aligné juste sous l'icône */
.section-05-box h3 {
	margin-top: 0;
	margin-bottom: 10px;
	font-weight: 700;
}

/* Texte interne */
.section-05-content p {
	margin: 0 0 6px;
	font-size: 14px;
	line-height: 1.5;
	color: #888!important;
}

/* Ligne "Disponible…" toujours au bas du bloc */
.section-05-price {
	margin-top: auto;       /* pousse cette ligne en bas de la box */
	margin-bottom: 20px;
	font-weight: 600;
	font-size: 14px;
	color: #888!important;
}
#addons-dedies .sd-estimator {
	background: #ffffff;
	border-radius: 6px;
	padding: 20px 25px;
	box-shadow: 0 18px 45px rgba(0, 0, 0, 0.35); /* ombre bien prononcée */
	border: 1px solid rgba(0, 0, 0, 0.05);
}

#addons-dedies .sd-addons-list li {
	margin-bottom: 10px;
}

/*Section Estimateur */
.sd-estimator-server{
	margin-bottom: 20px;
}
.sd-estimator-row {
	margin-top: 40px;
}

/* Grosse carte unifiée qui englobe gauche + droite */
.sd-estimator-card {
	background: #f9fafc;
	border-radius: 8px;
	padding: 24px 24px 26px;
	box-shadow: 0 18px 45px rgba(15, 23, 42, 0.18);
	border: 1px solid rgba(15, 23, 42, 0.08);
}

/* Zone gauche : simple séparation verticale */
.sd-estimator-left {
	padding-right: 24px;
	border-right: 1px solid rgba(148, 163, 184, 0.35);
}

/* Titre configurateur */
.sd-estimator-title {
	margin-top: 0;
	margin-bottom: 15px;
	font-size: 20px!important;
	font-weight: 400!important;
	text-align: center;
	text-transform: uppercase;
	color: #424854!important;
}

/* Label générique */
.sd-label {
	font-weight: 600;
	margin-bottom: 6px;
	display: flex;
	align-items: center;
	font-size: 12px;
	text-transform: uppercase;
	letter-spacing: .06em;
	color: #6b7280;
	margin-bottom: 6px;
}

/* Select stylé */
.sd-select-wrapper {
	margin-bottom: 18px;
}

.sd-select {
	border-radius: 6px;
	border: 1px solid #d0d5dd;
	padding: 10px 12px;
	font-weight: 600;
	box-shadow: 0 3px 10px rgba(15, 23, 42, 0.12);
	transition: all .15s ease;
}

.sd-select:focus {
	outline: none;
	border-color: #c62828;
	box-shadow: 0 0 0 2px rgba(198, 40, 40, 0.15);
}

/* "Table" invisible pour les addons */
.sd-addons {
	margin-top: 10px;
}

.sd-addons-header {
	text-align: left!important;
	font-weight: 600;
	display: flex;
	align-items: center;
	font-size: 12px;
	text-transform: uppercase;
	color: #6b7280;
	margin-bottom: 6px;
}

.sd-col-check {
	width: 32px;
	flex: 0 0 32px;
}

.sd-col-desc {
	flex: 1 1 auto;
	padding-right: 8px;
}

.sd-col-price {
	width: 90px;
	flex: 0 0 90px;
	font-size: 13px;
}

/* Une ligne d’addon = carte avec ombre légère */
.sd-addon-item {
	background: #ffffff;
	border-radius: 6px;
	border: 1px solid rgba(148, 163, 184, 0.4);
	margin-bottom: 8px;
	box-shadow: 0 4px 14px rgba(15, 23, 42, 0.12);
	transition: box-shadow .15s ease, transform .15s ease, border-color .15s ease;
}

.sd-addon-item:hover {
	box-shadow: 0 7px 20px rgba(15, 23, 42, 0.18);
	transform: translateY(-1px);
	border-color: #c62828;
}

.sd-addon-label {
	display: flex;
	align-items: center;
	padding: 8px 10px;
	cursor: pointer;
	margin: 0;
}

.sd-addon-label input[type="checkbox"] {
	margin-top: 0;
}

.sd-addon-sub {
	display: block;
	font-size: 12px;
	color: #6b7280;
}

/* Reçu à droite : petite carte flottante à l'intérieur */
.sd-estimator-summary {
	background: #ffffff;
	border-radius: 6px;
	border-bottom: 3px solid #424854!important;
	box-shadow: 0 12px 30px rgba(15, 23, 42, 0.25);
	border: 1px solid rgba(15, 23, 42, 0.16);
	overflow: hidden;
}

/* Header du reçu */
.sd-summary-header {
	background: #424854;
	color: #ffffff;
	padding: 12px 16px;
}

.sd-summary-header h4 {
	margin: 0;
	font-size: 16px;
	font-weight: 600;
	color: #fff!important;
	padding-bottom: 0!important;
	font-size: 18px!important;
}

/* Corps du reçu */
.sd-summary-body {
	padding: 14px 16px 16px;
	background: #f8fafc;
}

.sd-summary-section {
	margin-bottom: 10px;
}

.sd-summary-label {
	font-size: 12px;
	text-transform: uppercase;
	color: #6b7280;
	letter-spacing: .06em;
	margin-bottom: 4px;
}

.sd-summary-line {
	display: flex;
	justify-content: space-between;
	font-size: 13px;
	line-height: 1.4;
}

.sd-summary-totalbox {
	margin-top: 10px;
	padding-top: 10px;
	border-top: 1px solid rgba(148, 163, 184, 0.6);
}

.sd-summary-total-main {
	display: flex;
	justify-content: space-between;
	align-items: baseline;
	font-weight: 600;
	margin-bottom: 4px;
}

.sd-summary-total-amount {
	font-size: 20px;
}

/* Responsive : reçu en dessous mais même carte */
@media (max-width: 767px) {
	.sd-estimator-left {
		padding-right: 0;
		border-right: none;
		border-bottom: 1px solid rgba(148, 163, 184, 0.35);
		padding-bottom: 16px;
		margin-bottom: 16px;
	}

	.sd-estimator-summary {
		margin-left: 0;
	}

	.sd-addon-label {
		flex-wrap: wrap;
	}

	.sd-col-price {
		width: auto;
		flex: 0 0 50%;
		margin-top: 4px;
	}
}


/* Dropdown serveur dédié */
.sd-server-dropdown {
	position: relative;
}

.sd-server-toggle {
	width: 100%;
	border-radius: 6px;
	border: 1px solid #d0d5dd;
	padding: 10px 12px;
	font-weight: 600;
	background: #ffffff;
	box-shadow: 0 3px 10px rgba(15, 23, 42, 0.12);
	display: flex;
	align-items: center;
	justify-content: space-between;
	cursor: pointer;
	transition: all .15s ease;
}

.sd-server-toggle:hover {
	border-color: #c62828;
	box-shadow: 0 4px 14px rgba(15, 23, 42, 0.18);
}

.sd-server-toggle-icon {
	margin-left: 8px;
	font-size: 12px;
	color: #6b7280;
	top:-8px;
	position: relative;
	width:24px!important;
	height:24px!important;
	padding-top:5px!important;
	font-size:12px!important;
}


.sd-server-menu {
	position: absolute;
	left: 0;
	right: 0;
	top: 100%;
	margin-top: 4px;
	background: #ffffff;
	border-radius: 8px;
	box-shadow: 0 18px 40px rgba(15, 23, 42, 0.25);
	border: 1px solid rgba(15, 23, 42, 0.12);
	z-index: 50;
	max-height: 320px;
	overflow-y: auto;
	display: none; /* affiché via JS */
}

.sd-server-dropdown.open .sd-server-menu {
	display: block;
}

.sd-server-option {
	border-bottom: 1px solid rgba(148, 163, 184, 0.25);
}

.sd-server-option:last-child {
	border-bottom: none;
}

.sd-server-row {
	display: flex;
	align-items: center;
	padding: 10px 12px;
	cursor: pointer;
	transition: background .12s ease;
}

.sd-server-row:hover {
	background: #f3f4f6;
}

.sd-server-col-main {
	flex: 1 1 auto;
	padding-right: 8px;
}

.sd-server-name {
	font-weight: 600;
	margin-bottom: 2px;
}

.sd-server-spec {
	font-size: 12px;
	color: #6b7280;
}

.sd-server-col-price {
	flex: 0 0 110px;
	font-size: 13px;
	white-space: nowrap;
}

/* Sur mobile : on garde toute la largeur de la carte */
@media (max-width: 767px) {
	.sd-server-menu {
		position: static;
		margin-top: 8px;
		box-shadow: 0 8px 24px rgba(15, 23, 42, 0.20);
	}
}

/* Résumé : liste des ajouts */
.sd-summary-addons-header,
.sd-summary-addon-row {
	display: flex;
	align-items: center;
	justify-content: space-between;
	font-size: 13px;
	line-height: 1.4;
}
#sd-summary-addons-empty{
	text-align: left!important;
}
.sd-summary-addons-header {
	font-size: 11px;
	text-transform: uppercase;
	color: #6b7280;
	letter-spacing: .06em;
	margin-bottom: 4px;
}

.sd-summary-addon-name {
	flex: 1 1 auto;
	padding-right: 6px;
	text-align: left!important;
}

.sd-summary-addon-price {
	flex: 0 0 90px;
	text-align: right;
	white-space: nowrap;
	font-variant-numeric: tabular-nums;
}

/* Note en bas du reçu */
.sd-summary-note {
	margin-top: 10px;
	font-size: 11px;
	color: #6b7280;
}
.sd-summary-line-server {
	display: flex;
	align-items: center;
	justify-content: space-between;
	font-size: 13px;
	margin-top: 4px;
}

/* --- Checkbox custom dans l'estimateur --- */
.sd-addon-label {
	position: relative;
	display: flex;
	align-items: center;
	padding: 12px 18px;
	border-radius: 12px;
	
	box-shadow: 0 2px 4px rgba(15, 23, 42, 0.03);
	background: #ffffff;
	cursor: pointer;
	transition: border-color 0.18s ease, box-shadow 0.18s ease,
	background-color 0.18s ease;
}

.sd-addon-label:hover {
	border-color: #d0d7e2;
	box-shadow: 0 4px 10px rgba(15, 23, 42, 0.06);
}

/* Colonne du carré */
.sd-col-check {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 28px;
	height: 28px;
	margin-right: 14px;
	flex-shrink: 0;
}

/* On cache le checkbox natif mais on garde l’accessibilité */
.sd-col-check input[type="checkbox"] {
	position: absolute;
	inset: 0;
	opacity: 0;
	margin: 0;
	cursor: pointer;
	z-index: 2;
}

/* Carré de base */
.sd-col-check::before {
	content: "";
	width: 22px;
	height: 22px;
	border-radius: 7px;
	border: 2px solid #d0d7e2;
	background: #ffffff;
	box-shadow: 0 1px 2px rgba(15, 23, 42, 0.08);
	transition: background-color 0.18s ease, border-color 0.18s ease,
	box-shadow 0.18s ease;
}

/* Crochet */
.sd-col-check::after {
	content: "";
	position: absolute;
	width: 14px;
	height: 8px;
	border-left: 3px solid #22c55e;   /* vert */
	border-bottom: 3px solid #22c55e;
	transform: rotate(-45deg) scale(0.2);
	transform-origin: center;
	opacity: 0;
	transition: transform 0.18s cubic-bezier(0.16, 1, 0.3, 1),
	opacity 0.1s ease-out;
}

/* État coché : on ajoute la classe .is-checked sur le label en JS */
.sd-addon-label.is-checked .sd-col-check::before {
	background: #ecfdf3;
	border-color: #22c55e;
	box-shadow: 0 0 0 3px rgba(34, 197, 94, 0.25);
}

.sd-addon-label.is-checked .sd-col-check::after {
	opacity: 1;
	transform: rotate(-45deg) scale(1.1); /* dépasse un peu du carré */
}

/* Petit coup visuel sur toute la ligne cochée */
.sd-addon-label.is-checked {
	background: linear-gradient(to right, #f0fbf5, #ffffff);
	border-color: #c4e9d3;
}


/* FIN SECTION SERVEURS DÉDIÉS */