/* SebWeb — UI front public (hors espace membre / gestion) */

#page.front-site {
	text-align: left;
}

#page.front-site .mapage.container,
#page.front-site .front-page {
	padding-top: 8px;
	padding-bottom: 36px;
}

/* Fil d'Ariane */
.front-breadcrumb {
	margin: 24px 0 16px;
	font-size: 13px;
	color: #6c757d;
	text-align: left;
}

.front-breadcrumb a {
	color: #1eabe3;
	text-decoration: none;
}

.front-breadcrumb a:hover {
	text-decoration: underline;
}

/* Hero */
.front-hero {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 20px 28px;
	margin-bottom: 28px;
	padding: 24px 26px;
	border: 1px solid #e8eef2;
	border-radius: 14px;
	background: linear-gradient(135deg, #f3f9fc 0%, #fdf2f8 100%);
}

.front-hero__copy {
	flex: 1 1 280px;
	min-width: 0;
}

.front-hero h1,
#page.front-site .front-page > h1:first-child,
#page.front-site .container > h1:first-child {
	margin: 0 0 12px;
	border-bottom: solid 2px #000;
	display: inline;
	padding-bottom: 4px;
	font-weight: 600;
	font-stretch: condensed;
	line-height: 1.25;
}

.front-hero__lead {
	margin: 14px 0 0;
	color: #495057;
	line-height: 1.7;
	max-width: 52em;
}

.front-hero__media img {
	max-width: 220px;
	margin: 0 auto;
	display: block;
}

.front-hero__cta a {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	padding: 14px 22px;
	border-radius: 999px;
	background: #1eabe3;
	color: #fff !important;
	font-weight: 600;
	font-size: 15px;
	text-decoration: none;
	box-shadow: 0 4px 14px rgba(30, 171, 227, 0.35);
	transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.front-hero__cta a:hover {
	transform: translateY(-1px);
	box-shadow: 0 6px 18px rgba(30, 171, 227, 0.42);
	text-decoration: none;
}

/* Sections */
.front-section {
	margin-bottom: 28px;
	border: 1px solid #e8eef2;
	border-radius: 14px;
	background: #fff;
	box-shadow: 0 2px 14px rgba(0, 0, 0, 0.04);
	overflow: hidden;
}

.front-section__head {
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 16px 20px;
	background: linear-gradient(90deg, #22abe3 0%, #1e8fc4 100%);
	color: #fff;
}

.front-section__title {
	margin: 0;
	font-size: clamp(1.05rem, 2vw, 1.25rem);
	font-weight: 600;
}

.front-section__body {
	padding: 16px 20px 20px;
}

/* Cartes contact / services */
.front-service-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
	gap: 16px;
	margin: 24px 0;
}

.front-service-card {
	display: flex;
	flex-direction: column;
	gap: 12px;
	padding: 18px;
	border: 1px solid #e8eef2;
	border-radius: 14px;
	background: rgba(240, 248, 255, 0.67);
	text-align: left;
	transition: box-shadow 0.2s ease, transform 0.2s ease;
}

.front-service-card:hover {
	box-shadow: 0 4px 18px rgba(30, 171, 227, 0.12);
	transform: translateY(-1px);
}

.front-service-card img {
	width: 72px;
	height: 72px;
	object-fit: contain;
}

.front-service-card strong {
	display: block;
	color: #212529;
	font-size: 15px;
	margin-bottom: 4px;
}

.front-service-card a {
	color: inherit;
	text-decoration: none;
}

.front-service-card .btn {
	align-self: flex-start;
}

/* Formulaires */
.front-form-card {
	max-width: 760px;
	margin: 0 auto 28px;
	padding: 24px;
	border: 1px solid #e8eef2;
	border-radius: 14px;
	background: #fff;
	box-shadow: 0 2px 14px rgba(0, 0, 0, 0.04);
}

.front-form-card .form-group,
.front-form-card .front-form-row {
	margin-bottom: 16px;
}

.front-form-card label {
	display: block;
	margin-bottom: 6px;
	font-weight: 600;
	color: #343a40;
	font-size: 14px;
}

.front-form-card .form-control,
.front-form-card select,
.front-form-card textarea {
	border-radius: 8px;
	border-color: #ced4da;
}

.front-form-card .form-control:focus {
	border-color: #1eabe3;
	box-shadow: 0 0 0 3px rgba(30, 171, 227, 0.15);
}

.front-form-actions {
	margin-top: 20px;
	text-align: center;
}

/* Flash messages */
.front-flash {
	margin: 0 0 20px;
	padding: 14px 18px;
	border-radius: 10px;
	font-weight: 600;
	text-align: left;
}

.front-flash--success {
	background: #dff2bf;
	border: 1px solid #b8d993;
	color: #2d5016;
}

.front-flash--warning {
	background: #feefb3;
	border: 1px solid #f0d56a;
	color: #7a5b00;
}

.front-flash--error {
	background: #ffbaba;
	border: 1px solid #f08a8a;
	color: #8a1f1f;
}

.front-flash--info {
	background: #e8f6fc;
	border: 1px solid #a8daf0;
	color: #15557b;
}

/* CTA bandeau */
.front-cta-band {
	margin: 36px 0 12px;
	padding: 32px 24px;
	border-radius: 14px;
	background: linear-gradient(135deg, rgba(30, 171, 227, 0.12) 0%, rgba(226, 1, 123, 0.08) 100%);
}

.front-cta-band__inner {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	gap: 24px;
	max-width: 880px;
	margin: 0 auto;
}

.front-cta-band__text {
	flex: 1 1 260px;
	margin: 0;
	font-size: clamp(1.05rem, 2.2vw, 1.35rem);
	font-weight: 600;
	line-height: 1.45;
	color: #212529;
}

.front-cta-band__btn {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	padding: 12px 22px;
	border: 1px solid #e4e4e4;
	border-radius: 3rem;
	background: #fff;
	color: #1eabe3 !important;
	font-size: 17px;
	font-weight: 600;
	text-decoration: none;
	transition: box-shadow 0.2s ease;
}

.front-cta-band__btn:hover {
	box-shadow: 0 4px 16px rgba(30, 171, 227, 0.2);
	text-decoration: none;
}

/* Maillage */
.front-maillage {
	margin-top: 36px;
	padding-top: 28px;
	border-top: 1px solid #e8eef2;
	text-align: left;
}

.front-maillage__title {
	margin: 0 0 14px;
	color: #1eabe3;
	font-size: clamp(1.2rem, 2.2vw, 1.5rem);
	font-weight: 600;
}

.front-maillage ul {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.front-maillage a {
	display: inline-block;
	padding: 8px 14px;
	border-radius: 999px;
	border: 1px solid #d7e8f0;
	color: #0879af;
	font-size: 14px;
	text-decoration: none;
}

.front-maillage a:hover {
	background: #eef8fc;
	text-decoration: none;
}

/* Pages légales */
.front-legal {
	text-align: left;
	font-size: 15px;
	line-height: 1.75;
	color: #343a40;
}

.front-legal h1 {
	margin-bottom: 20px;
}

.front-legal h2 {
	margin: 28px 0 12px;
	color: #0879af;
	font-size: 1.15rem;
	font-weight: 600;
}

.front-legal p,
.front-legal li {
	margin-bottom: 12px;
}

/* Pack hero */
.front-pack-hero {
	background: linear-gradient(180deg, #bfe7f7 0%, #d9f0fa 100%);
	padding: 28px 0 32px;
	margin-bottom: 24px;
}

.front-pack-hero__grid {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 24px;
}

.front-pack-hero__copy {
	flex: 1 1 280px;
}

.front-pack-hero h1 {
	color: #fff;
	text-shadow: 0 2px 8px rgba(0, 0, 0, 0.25);
	border-bottom: none;
	display: block;
	font-size: clamp(1.5rem, 3vw, 2.2rem);
	margin-bottom: 10px;
}

.front-pack-hero__lead {
	color: rgba(255, 255, 255, 0.95);
	line-height: 1.6;
	margin: 0;
}

.front-pack-hero__media {
	flex: 0 1 280px;
}

/* Offres / cartes promo */
.front-offer-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
	gap: 20px;
	margin: 28px 0;
}

.front-offer-card {
	padding: 20px;
	border: 1px solid #e8eef2;
	border-radius: 14px;
	background: #fff;
	box-shadow: 0 2px 12px rgba(0, 0, 0, 0.04);
	text-align: left;
}

.front-offer-card h2 {
	margin: 0 0 12px;
	font-size: 1.15rem;
	color: #0879af;
}

.front-offer-card img {
	max-width: 120px;
	float: left;
	margin: 0 14px 8px 0;
	border-radius: 8px;
}

.front-offer-card p {
	overflow: hidden;
	line-height: 1.65;
}

/* ─── Compatibilité markup legacy ─── */

#page.front-site .t0,
#page.front-site tr.t0 td,
#page.front-site tr.t0 th {
	background: #404040 !important;
	color: #fff !important;
	font-weight: 700;
	border: none !important;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	font-size: 12px;
}

#page.front-site .t3,
#page.front-site tr.t3 td {
	background: linear-gradient(90deg, #22abe3 0%, #1e8fc4 100%) !important;
	color: #fff !important;
	font-weight: 600;
	border: none !important;
	padding: 12px 16px !important;
}

#page.front-site .table,
#page.front-site table.table {
	border: 1px solid #e8eef2;
	border-radius: 12px;
	overflow: hidden;
	background: #fff;
	box-shadow: 0 2px 12px rgba(0, 0, 0, 0.04);
	margin-bottom: 24px;
}

#page.front-site .table > tbody > tr > td,
#page.front-site .table > tbody > tr > th,
#page.front-site .table > thead > tr > td,
#page.front-site .table > thead > tr > th {
	border-color: #eef2f5;
	padding: 12px 16px;
	vertical-align: top;
}

#page.front-site .table-striped > tbody > tr:nth-of-type(odd) {
	background: #fafcfd;
}

#page.front-site .table-hover > tbody > tr:hover {
	background: rgba(30, 171, 227, 0.06);
}

#page.front-site .front-table-scroll,
#page.front-site .table-responsive,
#page.front-site .slider.table-responsive {
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
	border-radius: 12px;
	margin-bottom: 24px;
}

/* Bandeau avis / notes packs (fond bleu, tableaux blancs) */
#page.front-site .pack-rating-band {
	background-color: #1babe4;
	color: #fff;
	padding: 30px;
	text-align: center;
}

#page.front-site .pack-rating-band h2 {
	color: #fff;
	margin: 0 0 20px;
}

#page.front-site .pack-rating-band .table td,
#page.front-site .pack-rating-band .table th {
	color: #495057;
}

#page.front-site .pack-rating-band .table td:first-child {
	color: #333;
	font-weight: 500;
}

#page.front-site .byt {
	background: rgba(240, 248, 255, 0.85) !important;
	padding: 16px !important;
	border: 1px solid #e8eef2 !important;
	border-radius: 14px !important;
	margin-bottom: 16px;
	transition: box-shadow 0.2s ease;
}

#page.front-site .byt:hover {
	box-shadow: 0 4px 16px rgba(30, 171, 227, 0.1);
}

#page.front-site .list-group-item {
	border-color: #e8eef2;
	border-radius: 10px !important;
	margin-bottom: 8px;
	padding: 14px 16px;
}

#page.front-site .panel-group .panel {
	border-radius: 12px;
	border-color: #e8eef2;
	box-shadow: none;
	margin-bottom: 10px;
	overflow: hidden;
}

#page.front-site .panel-default > .panel-heading {
	background: #f8fafb;
	border-color: #e8eef2;
}

#page.front-site .panel-title a {
	color: #0879af;
	font-weight: 600;
	text-decoration: none;
}

#page.front-site .panel-body {
	line-height: 1.7;
	color: #495057;
}

#page.front-site h2,
#page.front-site h3.text-center.text-color-pink {
	color: #e2017b;
	line-height: 1.45;
}

#page.front-site .text-color-pink {
	color: #e2017b !important;
}

#page.front-site .btn-pink,
#page.front-site .btn-bleu {
	border-radius: 999px;
	font-weight: 600;
	padding: 8px 18px;
}

#page.front-site .card {
	border-radius: 14px;
	border-color: #e8eef2;
	box-shadow: 0 2px 12px rgba(0, 0, 0, 0.04);
	transition: transform 0.2s ease, box-shadow 0.2s ease;
}

#page.front-site .card:hover {
	transform: translateY(-2px);
	box-shadow: 0 6px 20px rgba(0, 0, 0, 0.08);
}

#page.front-site .price-digits {
	color: #e2017b;
	font-weight: 700;
}

#page.front-site fieldset {
	border: 1px solid #e8eef2 !important;
	border-radius: 12px;
	padding: 20px !important;
	background: #f8fafb;
}

#page.front-site .container-fluid[style*="bkg_home_seb"],
#page.front-site section.container-fluid[style*="background"] {
	border-radius: 0;
	margin-top: 24px;
}

#page.front-site .vertical-align-col {
	display: flex;
	flex-direction: column;
	justify-content: center;
}

#page.front-site #infobox .alert_box,
#page.front-site #infobox .warning_box,
#page.front-site #infobox .info_box {
	border-radius: 10px;
	box-shadow: 0 4px 18px rgba(0, 0, 0, 0.12);
}

#page.front-site .form_sous,
#page.front-site #der_seq {
	text-align: left;
}

#page.front-site #der_seq h1 {
	font-size: clamp(1.2rem, 2.5vw, 1.6rem);
	color: #0879af;
	margin-bottom: 16px;
}

#page.front-site .front-devis-wizard fieldset {
	background: #fff;
	border: 1px solid #e8eef2 !important;
	border-radius: 14px;
	padding: 20px 24px !important;
	margin-bottom: 16px;
	box-shadow: 0 2px 12px rgba(0, 0, 0, 0.04);
}

@media (max-width: 767px) {
	.front-hero {
		padding: 18px 16px;
	}

	.front-form-card {
		padding: 16px;
	}

	#page.front-site .table > tbody > tr > td,
	#page.front-site .table > tbody > tr > th {
		display: block;
		width: 100%;
		box-sizing: border-box;
	}

	#page.front-site .table > tbody > tr > td:before {
		content: attr(data-label);
		display: block;
		font-weight: 600;
		font-size: 12px;
		color: #6c757d;
		margin-bottom: 4px;
	}

	.front-offer-card img {
		float: none;
		display: block;
		margin: 0 0 12px;
	}
}

/* --- Phase 2 SEO / conversion --- */
.front-section-title {
	font-size: clamp(1.25rem, 2.5vw, 1.65rem);
	font-weight: 600;
	color: #0879af;
	margin: 0 0 16px;
}

.front-trust {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 16px 24px;
	background: linear-gradient(135deg, #f0f9fd 0%, #fff 100%);
	border: 1px solid #d4ecf7;
	border-radius: 14px;
	padding: 20px 24px;
	margin: 28px 0;
}

.front-trust-score {
	font-size: 2.4rem;
	font-weight: 700;
	color: #f53a9a;
	line-height: 1;
}

.front-trust-score span:last-child {
	font-size: 1rem;
	color: #6c757d;
	font-weight: 400;
}

.front-trust-meta {
	flex: 1 1 200px;
	font-size: 15px;
	color: #495057;
}

.front-trust-meta a {
	color: #0879af;
	text-decoration: underline;
}

.front-trust-quotes {
	flex: 1 1 100%;
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
	gap: 12px;
	margin-top: 4px;
}

.front-trust-quote {
	margin: 0;
	padding: 12px 16px;
	background: #fff;
	border-radius: 10px;
	border-left: 3px solid #1babe4;
	font-size: 14px;
	color: #495057;
}

.front-trust-quote cite {
	display: block;
	margin-top: 8px;
	font-size: 13px;
	color: #6c757d;
	font-style: normal;
}

.front-cases {
	margin: 36px 0;
}

.front-cases-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
	gap: 16px;
}

.front-case {
	display: block;
	padding: 20px;
	background: #fff;
	border: 1px solid #e8eef2;
	border-radius: 12px;
	text-decoration: none !important;
	color: inherit;
	transition: border-color 0.2s, box-shadow 0.2s;
}

.front-case:hover,
.front-case:focus {
	border-color: #1babe4;
	box-shadow: 0 6px 20px rgba(27, 171, 228, 0.12);
	text-decoration: none;
	color: inherit;
}

.front-case-tag {
	display: inline-block;
	font-size: 11px;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	color: #f53a9a;
	margin-bottom: 8px;
}

.front-case h3 {
	font-size: 1.05rem;
	margin: 0 0 8px;
	color: #0879af;
}

.front-case p {
	margin: 0;
	font-size: 14px;
	color: #6c757d;
	line-height: 1.5;
}

.front-showcase {
	margin: 36px 0;
}

.front-showcase__lead {
	max-width: 820px;
	margin: 0 0 20px;
	font-size: 16px;
	line-height: 1.7;
	color: #495057;
}

.front-showcase-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
	gap: 18px;
}

.front-showcase-card {
	padding: 22px 20px;
	background: #fff;
	border: 1px solid #e8eef2;
	border-radius: 12px;
	height: 100%;
}

.front-showcase-card__icon {
	width: 44px;
	height: 44px;
	border-radius: 10px;
	background: #f0f9fd;
	color: #1babe4;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 20px;
	margin-bottom: 12px;
}

.front-showcase-card__tag {
	display: inline-block;
	font-size: 11px;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	color: #f53a9a;
	margin-bottom: 8px;
}

.front-showcase-card h3 {
	font-size: 1.05rem;
	margin: 0 0 10px;
	color: #0879af;
}

.front-showcase-card p {
	margin: 0;
	font-size: 14px;
	color: #6c757d;
	line-height: 1.55;
}

.front-faq {
	margin: 36px 0;
}

.front-faq details {
	border: 1px solid #e8eef2;
	border-radius: 10px;
	margin-bottom: 10px;
	background: #fff;
}

.front-faq summary {
	padding: 14px 18px;
	font-weight: 600;
	color: #0879af;
	cursor: pointer;
	list-style: none;
}

.front-faq summary::-webkit-details-marker {
	display: none;
}

.front-faq details p {
	padding: 0 18px 16px;
	margin: 0;
	font-size: 15px;
	color: #495057;
	line-height: 1.6;
}

.front-faq-maillage-wrap {
	margin-top: 36px;
	margin-bottom: 12px;
}

.front-faq-maillage-row {
	align-items: flex-start;
}

.front-faq-maillage-row .front-faq,
.front-faq-maillage-row .front-maillage {
	margin: 0;
}

.front-faq-maillage-row .front-maillage {
	padding-top: 0;
	border-top: none;
}

.front-faq-maillage-row__maillage .front-maillage-list,
.front-faq-maillage-row__maillage .front-maillage ul {
	flex-direction: column;
	align-items: flex-start;
}

@media (max-width: 991px) {
	.front-faq-maillage-row__maillage {
		margin-top: 28px;
	}
}

@media (min-width: 992px) {
	.front-faq-maillage-row__faq {
		padding-right: 18px;
	}

	.front-faq-maillage-row__maillage {
		padding-left: 18px;
	}
}

.front-use-maillage-wrap {
	margin-top: 36px;
	margin-bottom: 12px;
}

.front-use-maillage-row {
	align-items: flex-start;
}

.front-use-maillage-row .front-cases,
.front-use-maillage-row .front-maillage {
	margin: 0;
}

.front-use-maillage-row .front-maillage {
	padding-top: 0;
	border-top: none;
}

.front-use-maillage-row__cases .front-cases-grid {
	grid-template-columns: 1fr;
}

.front-use-maillage-row__maillage .front-maillage-list,
.front-use-maillage-row__maillage .front-maillage ul {
	flex-direction: column;
	align-items: flex-start;
}

@media (max-width: 991px) {
	.front-use-maillage-row__maillage {
		margin-top: 28px;
	}
}

@media (min-width: 992px) {
	.front-use-maillage-row__cases {
		padding-right: 18px;
	}

	.front-use-maillage-row__maillage {
		padding-left: 18px;
	}
}

.front-conv-strip {
	text-align: center;
	background: linear-gradient(135deg, #fef5fa 0%, #f0f9fd 100%);
	border: 1px solid #f5c2dc;
	border-radius: 16px;
	padding: 28px 24px;
	margin: 24px 0 32px;
}

.front-conv-strip__headline {
	font-size: clamp(1.2rem, 2.5vw, 1.5rem);
	color: #0879af;
	margin: 0 0 8px;
}

.front-conv-strip__subline {
	color: #6c757d;
	margin: 0 0 12px;
}

.front-conv-strip__price {
	font-size: clamp(2rem, 5vw, 3rem);
	color: #f53a9a;
	margin: 8px 0 12px;
}

.front-conv-strip__price .price-digits {
	font-size: inherit;
}

.front-conv-strip__proof {
	font-size: 14px;
	color: #495057;
	margin: 0 0 16px;
}

.front-conv-strip__actions {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
	justify-content: center;
}

.front-conv-cta {
	text-align: center;
	background: #0879af;
	color: #fff;
	border-radius: 16px;
	padding: 32px 24px;
	margin: 36px 0;
}

.front-conv-cta__headline {
	font-size: clamp(1.15rem, 2.5vw, 1.45rem);
	margin: 0 0 20px;
	color: #fff;
}

.front-conv-cta__actions {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
	justify-content: center;
	align-items: center;
}

.front-conv-cta__phone {
	color: #fff !important;
	font-size: 1.1rem;
	font-weight: 600;
	text-decoration: none !important;
	padding: 10px 16px;
	border: 2px solid rgba(255, 255, 255, 0.5);
	border-radius: 8px;
}

.front-conv-cta__phone:hover {
	background: rgba(255, 255, 255, 0.15);
	color: #fff;
}

.front-maillage {
	margin: 36px 0 24px;
}

.front-maillage-list {
	list-style: none;
	padding: 0;
	margin: 0;
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
}

.front-maillage-list a {
	display: inline-block;
	padding: 8px 16px;
	background: #f0f9fd;
	border: 1px solid #d4ecf7;
	border-radius: 999px;
	color: #0879af;
	font-size: 14px;
	text-decoration: none;
}

.front-maillage-list a:hover {
	background: #1babe4;
	border-color: #1babe4;
	color: #fff;
}

.front-contact-reassurance {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
	gap: 16px;
	margin: 24px 0;
}

.front-contact-reassurance div {
	padding: 16px;
	background: #f8fafb;
	border-radius: 10px;
	font-size: 14px;
	color: #495057;
}

.front-contact-reassurance strong {
	display: block;
	color: #0879af;
	margin-bottom: 4px;
}