/*
Theme Name: SG Concept (Hello Elementor Child)
Template: hello-elementor
Version: 1.0.0
Text Domain: hello-elementor-child
*/

/* ==========================================================================
   SG Concept : styles transverses. Couleurs et typos viennent du Kit Elementor (Réglages du site).
   Le socle de l'agence (assets/css/socle.css) est chargé avant : ce fichier ne fait que le surcharger.
   ========================================================================== */

:root {
	--pb-accent: var(--e-global-color-primary, #EA7300);
	--pb-accent-survol: var(--e-global-color-accent, #C96300);
	--pb-texte: var(--e-global-color-text, #29282B);
	--pb-pastille-survol: rgba(234, 115, 0, .1);
	--nav-height: 97px;
	--nav-gap: 12px;
	--sg-noir: var(--e-global-color-secondary, #1C1B1E);
	--sg-anthracite: var(--e-global-color-text, #29282B);
	--sg-orange: var(--e-global-color-primary, #EA7300);
	--sg-filet-clair: rgba(41, 40, 43, .14);
	--sg-filet-sombre: rgba(255, 255, 255, .14);
	--sg-anim: cubic-bezier(.7, 0, .2, 1);
}

body {
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

/* Pas de rognage des textes (text-box) : cette maquette mesure ses écarts entre boîtes de texte, interligne compris. */

.elementor-widget-text-editor p {
	margin: 0;
}

.elementor-widget-text-editor p + p {
	margin-top: 1.65em;
}

.elementor-widget-text-editor strong {
	font-weight: 500;
}

.elementor-widget-text-editor strong.sg-fort {
	font-weight: 600;
}

p.elementor-heading-title {
	margin: 0;
}

/* --------------------------------------------------------------------------
   Header : transparent sur le hero, puis barre sombre translucide floutée au scroll, plus fine
   (classe .scrollHeader posée par site.js sur #navBar).
   -------------------------------------------------------------------------- */
.pb-header {
	position: fixed !important;
	top: 0;
	left: 0;
	right: 0;
	z-index: 999;
	border-bottom: 1px solid rgba(255, 255, 255, .5);
	transition: background-color .35s ease, border-color .35s ease, backdrop-filter .35s ease, box-shadow .35s ease;
}

body.admin-bar .pb-header {
	top: 32px;
}

@media (max-width: 782px) {
	body.admin-bar .pb-header {
		top: 46px;
	}
}

.pb-header.scrollHeader.e-con {
	--padding-top: 4px;
	--padding-bottom: 2px;
	background-color: rgba(20, 19, 22, .62) !important;
	-webkit-backdrop-filter: blur(16px) saturate(1.3);
	backdrop-filter: blur(16px) saturate(1.3);
	border-bottom-color: rgba(255, 255, 255, .12);
	box-shadow: 0 12px 32px rgba(0, 0, 0, .18);
}

.pb-header .sg-logo img {
	width: 82px;
	transition: width .35s ease;
}

.pb-header.scrollHeader .sg-logo img {
	width: 58px;
}

.pb-header .sg-signature .elementor-heading-title {
	white-space: nowrap;
}

.pb-header .sg-logo-fr img {
	transition: width .35s ease;
}

.pb-header.scrollHeader .sg-logo-fr img {
	width: 36px;
}

.pb-header .sg-btn .elementor-button {
	transition: min-height .35s ease, color .45s ease;
}

.pb-header.scrollHeader .sg-btn .elementor-button {
	min-height: 44px;
	padding-top: 4px;
	padding-bottom: 4px;
}

@media (max-width: 1024px) {
	.pb-header .sg-logo img {
		width: 70px;
	}

	.pb-header.scrollHeader .sg-logo img {
		width: 52px;
	}
}

@media (max-width: 767px) {
	.pb-header .sg-logo img {
		width: 58px;
	}

	.pb-header.scrollHeader .sg-logo img {
		width: 46px;
	}

	.pb-header .sg-signature {
		display: none;
	}

	.pb-header .sg-logo-fr img {
		width: 30px;
	}

	.pb-header.scrollHeader .sg-logo-fr img {
		width: 26px;
	}
}

/* Menu « priorité » : les liens restent sur une ligne ; ceux qui n'ont plus la place passent un à un dans
   l'entrée « Plus » (site.js), dont le sous-menu reprend les pastilles du socle. */
.sg-nav-prio {
	flex: 1 1 0% !important;
	min-width: 0;
}

/* Conteneurs du header et photos de l'À propos : largeur au contenu (un conteneur enfant prend 100 % par défaut). */
.sg-header-logo.e-con,
.sg-header-actions.e-con {
	--width: auto !important;
	flex: none !important;
}

.sg-apropos-photos.e-con {
	--width: auto !important;
	flex: 1 1 0% !important;
	min-width: 0;
}

@media (max-width: 1024px) {
	.sg-apropos-photos.e-con {
		--width: 100% !important;
		flex: none !important;
		--justify-content: flex-start !important;
		justify-content: flex-start !important;
	}
}

.sg-nav-prio .elementor-nav-menu--main > .elementor-nav-menu {
	flex-wrap: nowrap;
	justify-content: center;
}

.sg-nav-prio .elementor-nav-menu--main > .elementor-nav-menu > li {
	flex: none;
}

.sg-nav-prio .elementor-item {
	white-space: nowrap;
	letter-spacing: .04em !important;
}

@media (min-width: 1025px) {
	.sg-footer-coordonnees .elementor-heading-title,
	.sg-footer-menu .elementor-item {
		white-space: nowrap;
	}
}

.sg-nav-prio .sg-plus[hidden] {
	display: none !important;
}

.sg-nav-prio .sg-plus > a .sub-arrow {
	display: inline-flex;
	margin-inline-start: 8px;
}

.sg-nav-prio .sg-plus > a .sub-arrow svg {
	width: 10px;
	height: 10px;
	fill: none;
	stroke: currentColor;
	stroke-width: 1.6;
	transition: transform .25s ease;
}

.sg-nav-prio .sg-plus > a.highlighted .sub-arrow svg {
	transform: rotate(180deg);
}

.sg-nav-prio .sg-plus > .sub-menu {
	min-width: 240px;
	right: 0;
	left: auto !important;
}

.pb-header .elementor-nav-menu--dropdown .elementor-item,
.pb-header .elementor-nav-menu--main .sub-menu .elementor-sub-item {
	letter-spacing: .06em;
}

/* Burger */
.pb-header .sg-burger .elementor-menu-toggle {
	width: 44px;
	height: 44px;
}

/* Action du header dans le burger : bouton orange. */
.pb-header .pb-menu-action--plein {
	--pb-menu-action-fond: var(--sg-orange);
	--pb-menu-action-texte: #fff;
}

/* --------------------------------------------------------------------------
   Boutons SG : pilule + pastille ronde fléchée. Survol (choix du client) : le bouton se remplit en balayage,
   le contour reste, les couleurs du texte et de la pastille s'inversent, la flèche tourne.
   -------------------------------------------------------------------------- */
.sg-btn--orange,
.sg-form {
	--sg-btn-fond: var(--sg-orange);
	--sg-btn-texte: #fff;
	--sg-btn-contour: var(--sg-orange);
}

.sg-btn--blanc {
	--sg-btn-fond: #fff;
	--sg-btn-texte: var(--sg-anthracite);
	--sg-btn-contour: rgba(255, 255, 255, .35);
}

.sg-btn--sombre {
	--sg-btn-fond: var(--sg-anthracite);
	--sg-btn-texte: #fff;
	--sg-btn-contour: var(--sg-anthracite);
}

.sg-btn .elementor-button,
.sg-form .elementor-field-type-submit .elementor-button {
	position: relative;
	isolation: isolate;
	overflow: hidden;
	display: inline-flex;
	align-items: center;
	min-height: 50px;
	padding: 7px 7px 7px 26px !important;
	color: var(--sg-btn-texte) !important;
	background: var(--sg-btn-fond) !important;
	border: 1px solid var(--sg-btn-contour) !important;
	border-radius: 999px !important;
	transition: color .45s ease;
}

.sg-btn .elementor-button::before,
.sg-form .elementor-field-type-submit .elementor-button::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;
	border-radius: inherit;
	background: var(--sg-btn-texte);
	transform: scaleX(0);
	transform-origin: left center;
	transition: transform .5s var(--sg-anim);
}

.sg-btn .elementor-button-content-wrapper,
.sg-form .elementor-field-type-submit .elementor-button-content-wrapper {
	align-items: center;
	gap: 20px;
	width: 100%;
	justify-content: space-between;
}

.sg-btn .elementor-button-text,
.sg-form .elementor-field-type-submit .elementor-button-text {
	text-box: trim-both cap alphabetic;
	white-space: nowrap;
}

@media (max-width: 767px) {
	.sg-btn .elementor-button-text,
	.sg-form .elementor-field-type-submit .elementor-button-text {
		white-space: normal;
		text-align: left;
		line-height: 1.3 !important;
	}
}

.sg-btn .elementor-button-icon,
.sg-form .elementor-field-type-submit .elementor-button-icon {
	display: inline-flex;
	flex: none;
	align-items: center;
	justify-content: center;
	width: 34px;
	height: 34px;
	margin: 0 !important;
	border-radius: 50%;
	color: var(--sg-btn-fond);
	background: var(--sg-btn-texte);
	transition: background-color .45s ease, color .45s ease;
}

.sg-btn .elementor-button-icon svg,
.sg-form .elementor-field-type-submit .elementor-button-icon svg {
	width: 14px;
	height: 14px;
	fill: none !important;
	transition: transform .45s var(--sg-anim);
}

.sg-btn .elementor-button:is(:hover, :focus-visible),
.sg-form .elementor-field-type-submit .elementor-button:is(:hover, :focus-visible) {
	color: var(--sg-btn-fond) !important;
}

.sg-btn .elementor-button:is(:hover, :focus-visible)::before,
.sg-form .elementor-field-type-submit .elementor-button:is(:hover, :focus-visible)::before {
	transform: scaleX(1);
}

.sg-btn .elementor-button:is(:hover, :focus-visible) .elementor-button-icon,
.sg-form .elementor-field-type-submit .elementor-button:is(:hover, :focus-visible) .elementor-button-icon {
	color: var(--sg-btn-texte);
	background: var(--sg-btn-fond);
}

.sg-btn .elementor-button:is(:hover, :focus-visible) .elementor-button-icon svg,
.sg-form .elementor-field-type-submit .elementor-button:is(:hover, :focus-visible) .elementor-button-icon svg {
	transform: rotate(45deg);
}

/* Bouton du header et bouton blanc sur sombre : contour visible pendant le remplissage. */
.sg-btn--blanc .elementor-button:is(:hover, :focus-visible) {
	border-color: rgba(255, 255, 255, .6) !important;
}

/* Bouton en icône seule (socle, pb-icone-mobile) : la pastille seule, sans le padding de la pilule. */
@media (max-width: 767px) {
	.sg-btn.pb-icone-mobile .elementor-button {
		min-height: 44px;
		padding: 4px !important;
	}

	.sg-btn.pb-icone-mobile .elementor-button-icon {
		width: 34px;
		height: 34px;
	}
}

@media (prefers-reduced-motion: reduce) {
	.sg-btn .elementor-button::before,
	.sg-form .elementor-field-type-submit .elementor-button::before {
		transition: none;
	}
}

/* Lien rond des cartes Prestations : flèche qui tourne, cercle orange au survol. */
.sg-lien-rond .elementor-icon {
	color: var(--sg-anthracite);
	transition: color .3s ease;
}

.sg-lien-rond .elementor-icon svg {
	width: 40px;
	height: 40px;
	fill: none !important;
}

.sg-lien-rond .elementor-icon svg path:last-child {
	transform-origin: 50% 50%;
	transition: transform .45s var(--sg-anim);
}

.sg-carte-prest:is(:hover, :focus-within) .sg-lien-rond .elementor-icon {
	color: var(--sg-orange);
}

.sg-carte-prest:is(:hover, :focus-within) .sg-lien-rond svg path:last-child {
	transform: rotate(45deg);
}

/* Liens de texte (téléphone, adresse, pied de page) */
.sg-lien-survol a {
	transition: color .25s ease;
}

.sg-lien-survol a:is(:hover, :focus-visible) {
	color: var(--sg-orange) !important;
}

/* --------------------------------------------------------------------------
   Sections, sur-titres, labels verticaux, décor « SG »
   -------------------------------------------------------------------------- */
.sg-section,
.sg-col-label {
	position: relative;
}

.sg-section > .e-con-inner > :not(.sg-decor) {
	position: relative;
	z-index: 1;
}

.pb-surtitre {
	line-height: 0;
}

.pb-surtitre .elementor-heading-title {
	display: inline-flex;
	align-items: center;
	gap: 14px;
	vertical-align: top;
}

.pb-surtitre .elementor-heading-title::before {
	content: "";
	flex: 0 0 28px;
	width: 28px;
	height: 1px;
	background: var(--sg-orange);
}

/* Label vertical (texte pivoté) et son filet, à gauche de la colonne : desktop seulement (masqué par Elementor). */
.sg-label-vertical {
	pointer-events: none;
}

.sg-label-vertical .elementor-heading-title {
	writing-mode: vertical-rl;
	white-space: nowrap;
	text-box: normal;
}

.sg-label-vertical::after {
	content: "";
	position: absolute;
	top: 0;
	left: 19px;
	width: 1px;
	height: max(100%, var(--sg-filet, 250px));
	background: rgba(255, 255, 255, .5);
}

.elementor-widget-html.sg-decor {
	position: absolute !important;
	inset: 0;
	z-index: 0;
	width: auto !important;
	max-width: none !important;
	margin: 0 !important;
	overflow: hidden;
	pointer-events: none;
}

.sg-decor span {
	position: absolute;
	width: 799px;
	height: 653px;
	background: var(--sg-decor-couleur, rgba(57, 56, 59, .04));
	-webkit-mask: url("assets/img/decor-sg.webp") center / contain no-repeat;
	mask: url("assets/img/decor-sg.webp") center / contain no-repeat;
}

.sg-decor--prestations span {
	top: 177px;
	left: calc(50% - 979px);
}

.sg-decor--materiaux span {
	--sg-decor-couleur: rgba(219, 220, 221, .05);
	bottom: 349px;
	left: calc(50% - 835px);
}

.sg-decor--zone span {
	bottom: -153px;
	left: calc(50% - 862px);
}

.sg-decor--contact span {
	--sg-decor-couleur: rgba(219, 220, 221, .05);
	bottom: -136px;
	left: calc(50% - 7px);
}

@media (max-width: 1024px) {
	.sg-decor span {
		width: 560px;
		height: 458px;
	}

	.sg-decor--prestations span,
	.sg-decor--materiaux span,
	.sg-decor--zone span {
		left: -180px;
	}

	.sg-decor--contact span {
		left: auto;
		right: -200px;
		top: auto;
		bottom: 0;
	}
}

/* Listes à puces carrées orange et filets */
.sg-liste ul {
	margin: 0;
	padding: 0;
	list-style: none;
}

.sg-liste li {
	display: flex;
	align-items: center;
	gap: 16px;
	padding: 18px 0;
	border-top: 1px solid var(--sg-filet-clair);
}

.sg-liste li::before {
	content: "";
	flex: 0 0 5px;
	height: 5px;
	background: var(--sg-orange);
}

.sg-sombre .sg-liste li {
	border-top-color: var(--sg-filet-sombre);
}

.sg-liste--bas li:last-child {
	border-bottom: 1px solid var(--sg-filet-sombre);
}

.sg-liste--grande li {
	padding: 20px 0;
}

.sg-zone .sg-liste li {
	padding: 15px 0;
}

.sg-filet .elementor-divider {
	padding: 0 !important;
}

/* Note Google « 5/5 sur 40 avis » */
.sg-note {
	width: max-content !important;
	max-width: 100%;
}

.sg-note-valeur {
	font-size: 1.125rem;
	font-weight: 700;
}

.sg-note-valeur span {
	font-size: .75rem;
}

.sg-note--coin {
	position: absolute !important;
	top: 35px;
	right: max(20px, calc(50% - 715px));
	z-index: 2;
}

@media (max-width: 1024px) {
	.sg-note--coin {
		position: relative !important;
		top: 0;
		right: auto;
		margin-bottom: 24px !important;
	}
}

/* --------------------------------------------------------------------------
   Hero
   -------------------------------------------------------------------------- */
.sg-hero::after {
	content: "";
	position: absolute;
	inset: 0 0 auto;
	height: 240px;
	background: linear-gradient(to bottom, rgba(28, 27, 30, .7), rgba(28, 27, 30, 0));
	pointer-events: none;
}

.sg-hero > .e-con-inner {
	position: relative;
	z-index: 1;
}

.sg-h1 .elementor-heading-title {
	text-box: normal;
}

.sg-hero-contenu > .sg-h1 {
	width: 100%;
}

.sg-h1-accroche {
	display: block;
	margin-top: 14px;
	font-size: 1.75rem;
	font-style: italic;
	line-height: 1.5;
	letter-spacing: 0;
	color: rgba(255, 255, 255, .6);
}

@media (max-width: 1024px) {
	.sg-h1-accroche {
		font-size: 1.5rem;
	}
}

@media (max-width: 767px) {
	.sg-h1-accroche {
		font-size: 1.25rem;
	}
}

@media (min-width: 1025px) {
	.sg-hero-contenu.e-con {
		flex: 1 1 0% !important;
		min-width: 0;
		max-width: 760px;
	}

	.sg-hero-form.e-con {
		flex: 0 1 540px !important;
		min-width: 440px;
	}
}

@media (min-width: 1025px) and (max-width: 1366px) {
	.sg-hero .sg-h1 h1.elementor-heading-title {
		font-size: 2.875rem !important;
	}
}

@media (min-width: 1025px) and (max-width: 1180px) {
	.sg-hero .sg-h1 h1.elementor-heading-title {
		font-size: 2.5rem !important;
	}
}

.sg-hero-form .sg-note {
	margin-inline-start: auto;
}

/* Heros sous le header fixe (accueil, pages légales, plan du site, 404) : rôle « hero » sous le bas du header. */
.sg-hero.e-con {
	--padding-top: calc(var(--nav-height) + 64px) !important;
}

@media (max-width: 1024px) {
	.sg-hero.e-con {
		--padding-top: calc(var(--nav-height) + 72px) !important;
	}
}

@media (max-width: 767px) {
	.sg-hero.e-con {
		--padding-top: calc(var(--nav-height) + 56px) !important;
	}
}

.sg-hero-court.e-con {
	--padding-top: calc(var(--nav-height) + 96px) !important;
}

@media (max-width: 1024px) {
	.sg-hero-court.e-con {
		--padding-top: calc(var(--nav-height) + 72px) !important;
	}
}

@media (max-width: 767px) {
	.sg-hero-court.e-con {
		--padding-top: calc(var(--nav-height) + 56px) !important;
	}
}

/* --------------------------------------------------------------------------
   À propos, prestations, matériaux, engagements
   -------------------------------------------------------------------------- */
.sg-apropos-photos .elementor-widget-image img {
	display: block;
}

.sg-prest-image img {
	aspect-ratio: 282 / 360;
	height: auto !important;
	width: 100%;
	object-fit: cover;
}

.sg-carte-prest {
	height: 100%;
}

.sg-prestations-grille .e-loop-item > .e-con {
	height: 100%;
}

.sg-materiaux-bande {
	width: 100vw !important;
	max-width: 100vw !important;
	margin-inline: calc(50% - 50vw) !important;
}

.sg-materiau .elementor-widget-text-editor {
	min-height: 3.3em;
	max-width: 300px !important;
}

.sg-materiau:first-child {
	box-shadow: inset 1px 0 0 var(--sg-filet-sombre);
}

.sg-accent {
	display: block;
	width: 18px;
	height: 2px;
	background: var(--sg-orange);
}

.sg-accent-widget {
	line-height: 0;
}

/* --------------------------------------------------------------------------
   Processus : frise des 4 étapes (desktop), frise verticale en mobile
   -------------------------------------------------------------------------- */
.sg-timeline {
	--sg-repere-haut: calc(5.75rem + 28px);
	position: relative;
}

.sg-etape-numero .elementor-heading-title {
	text-box: normal;
}

.sg-etape--2 .sg-etape-numero .elementor-heading-title { color: rgba(234, 115, 0, .82) !important; }
.sg-etape--3 .sg-etape-numero .elementor-heading-title { color: rgba(234, 115, 0, .64) !important; }
.sg-etape--4 .sg-etape-numero .elementor-heading-title { color: rgba(234, 115, 0, .46) !important; }

.sg-repere-widget {
	position: relative;
	height: 26px;
	margin: 15px 0 30px !important;
	line-height: 0;
}

.sg-repere {
	position: absolute;
	top: 0;
	left: -1px;
	width: 26px;
	height: 26px;
	border-radius: 50%;
	background: rgba(234, 115, 0, .18);
}

.sg-repere::after {
	content: "";
	position: absolute;
	inset: 7px;
	border-radius: 50%;
	background: var(--sg-orange);
}

@media (min-width: 1025px) {
	.sg-timeline::before,
	.sg-timeline::after {
		content: "";
		position: absolute;
		left: 23px;
		right: 0;
		pointer-events: none;
	}

	.sg-timeline::before {
		top: calc(var(--sg-repere-haut) + 12px);
		height: 1px;
		background: rgba(41, 40, 43, .15);
	}

	.sg-timeline::after {
		top: calc(var(--sg-repere-haut) + 11px);
		right: -23px;
		height: 3px;
		background: linear-gradient(90deg, #EA7300 0%, rgba(234, 115, 0, .35) 80%, rgba(234, 115, 0, 0) 100%);
	}
}

@media (max-width: 767px) {
	.sg-timeline {
		--sg-repere-haut: 0px;
	}

	.sg-etape {
		position: relative;
	}

	.sg-etape::before {
		content: "";
		position: absolute;
		top: 0;
		bottom: -40px;
		left: 12px;
		width: 1px;
		background: rgba(234, 115, 0, .35);
	}

	.sg-etape:last-child::before {
		bottom: 0;
		background: linear-gradient(rgba(234, 115, 0, .35), rgba(234, 115, 0, 0));
	}

	.sg-repere-widget {
		position: absolute !important;
		top: 4px;
		left: 0;
		margin: 0 !important;
	}

	.sg-etape-numero {
		margin-bottom: 16px !important;
	}
}

/* --------------------------------------------------------------------------
   Réalisations : filtre, mosaïque (« Tout ») et grille carrée (filtre actif, classe posée par site.js)
   -------------------------------------------------------------------------- */
.sg-filtre .e-filter {
	gap: 36px;
}

.sg-filtre .e-filter-item {
	position: relative;
	padding: 0 0 10px !important;
	font-family: Poppins, sans-serif !important;
	font-size: 1rem !important;
	text-transform: none !important;
	letter-spacing: 0 !important;
	font-weight: 300 !important;
	line-height: 1.5;
	color: rgba(255, 255, 255, .5) !important;
	background: none !important;
	border: 0 !important;
	border-radius: 0 !important;
	transition: color .25s ease;
}

.sg-filtre .e-filter-item::after {
	content: "";
	position: absolute;
	left: 0;
	bottom: 0;
	width: 100%;
	height: 2px;
	background: var(--sg-orange);
	transform: scaleX(0);
	transform-origin: left center;
	transition: transform .4s var(--sg-anim);
}

.sg-filtre .e-filter-item:is(:hover, :focus-visible) {
	color: rgba(255, 255, 255, .85) !important;
}

.sg-filtre .e-filter-item[aria-pressed="true"] {
	color: #fff !important;
	font-weight: 400 !important;
}

.sg-filtre .e-filter-item[aria-pressed="true"]::after {
	transform: scaleX(1);
}

@media (max-width: 767px) {
	.sg-filtre .e-filter {
		gap: 24px;
	}
}

.sg-galerie .elementor-loop-container {
	display: grid !important;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 15px;
}

.sg-galerie .e-loop-item {
	aspect-ratio: 1;
	overflow: hidden;
}

.sg-galerie .e-loop-item > .e-con,
.sg-carte-real,
.sg-real-image,
.sg-real-image a {
	height: 100%;
}

.sg-real-image a {
	display: block;
}

.sg-real-image img {
	display: block;
	width: 100% !important;
	height: 100% !important;
	object-fit: cover;
	transition: transform .7s var(--sg-anim), filter .4s ease;
}

.sg-carte-real:is(:hover, :focus-within) .sg-real-image img {
	transform: scale(1.05);
}

/* Mosaïque de la maquette (motif de 7 photos, répété) : 4 colonnes 310 / 310 / 310 / 330, la hauteur des lignes vient
   des proportions des cases (la grande photo couvre les deux premières lignes). */
.sg-galerie--mosaique .elementor-loop-container {
	grid-template-columns: 310fr 310fr 310fr 330fr;
	gap: 20px;
}

.sg-galerie--mosaique .e-loop-item:nth-of-type(7n + 1) { grid-column: 1 / span 2; grid-row: span 2; aspect-ratio: auto; }
.sg-galerie--mosaique .e-loop-item:nth-of-type(7n + 2) { grid-column: 3; aspect-ratio: 310 / 260; }
.sg-galerie--mosaique .e-loop-item:nth-of-type(7n + 3) { grid-column: 4; aspect-ratio: 330 / 260; }
.sg-galerie--mosaique .e-loop-item:nth-of-type(7n + 4) { grid-column: 3 / span 2; aspect-ratio: 660 / 260; }
.sg-galerie--mosaique .e-loop-item:nth-of-type(7n + 5) { grid-column: 1; aspect-ratio: 310 / 400; }
.sg-galerie--mosaique .e-loop-item:nth-of-type(7n + 6) { grid-column: 2 / span 2; aspect-ratio: 640 / 400; }
.sg-galerie--mosaique .e-loop-item:nth-of-type(7n) { grid-column: 4; aspect-ratio: 330 / 400; }

@media (max-width: 1024px) {
	.sg-galerie .elementor-loop-container {
		grid-template-columns: repeat(3, minmax(0, 1fr));
		gap: 12px;
	}

	.sg-galerie--mosaique .elementor-loop-container {
		grid-template-columns: 310fr 310fr 310fr 330fr;
		gap: 12px;
	}
}

@media (max-width: 767px) {
	.sg-galerie .elementor-loop-container,
	.sg-galerie--mosaique .elementor-loop-container {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 10px;
	}

	.sg-galerie--mosaique .e-loop-item:nth-of-type(n) {
		grid-column: auto;
		grid-row: auto;
		aspect-ratio: 1;
	}

	.sg-galerie--mosaique .e-loop-item:nth-of-type(7n + 1),
	.sg-galerie--mosaique .e-loop-item:nth-of-type(7n + 4),
	.sg-galerie--mosaique .e-loop-item:nth-of-type(7n) {
		grid-column: 1 / span 2;
		aspect-ratio: 16 / 10;
	}
}

/* « Voir plus de réalisations » : bouton blanc à contour (le seul bouton de la grille à porter role="button"). */
.sg-galerie .e-load-more-anchor + .elementor-button-wrapper,
.sg-galerie .elementor-button-wrapper {
	margin-top: 40px;
	text-align: center;
}

.sg-galerie .elementor-button[role="button"] {
	padding: 16px 28px !important;
	font-family: Michroma, sans-serif;
	font-size: .875rem;
	letter-spacing: .06em;
	text-transform: uppercase;
	color: #fff !important;
	background: transparent !important;
	border: 1px solid rgba(255, 255, 255, .35) !important;
	border-radius: 999px !important;
	transition: color .35s ease, background-color .35s ease;
}

@media (max-width: 767px) {
	.sg-galerie .elementor-button[role="button"] {
		line-height: 1.3 !important;
	}
}

.sg-galerie .elementor-button[role="button"]:is(:hover, :focus-visible) {
	color: var(--sg-anthracite) !important;
	background: #fff !important;
}

/* --------------------------------------------------------------------------
   Avis
   -------------------------------------------------------------------------- */
.sg-etoiles {
	display: flex;
	gap: 6.5px;
	margin: 0;
	line-height: 0;
}

.sg-etoiles img {
	width: 12px;
	height: 11.5px;
}

.sg-avis-carrousel .e-loop-item > .e-con {
	height: 100%;
}

.sg-avis-carrousel .swiper-slide {
	height: auto;
}

.sg-avis-carrousel .sg-avis-texte {
	flex-grow: 0 !important;
}

@media (max-width: 767px) {
	.sg-avis-carrousel .swiper-wrapper {
		align-items: flex-start;
	}

	.sg-avis-carrousel .swiper-slide,
	.sg-avis-carrousel .e-loop-item > .e-con {
		height: auto !important;
	}

	.sg-liste li br {
		display: none;
	}

	.sg-materiau .elementor-widget-text-editor {
		min-height: 4.95em;
	}

	.sg-footer-bas a,
	.sg-footer-coordonnees a {
		display: inline-block;
		padding-block: 10px;
	}
}

@media (max-width: 1024px) {
	.sg-footer-menu .elementor-item {
		white-space: normal !important;
	}

	.sg-processus .elementor-widget-image,
	.sg-processus .elementor-widget-image img {
		width: 100% !important;
		max-width: 100% !important;
	}

	.sg-apropos-photo-2 {
		margin-left: auto !important;
	}
}

/* Tablette portrait : coordonnées et plan du site côte à côte sous le bloc devis ; pages sans devis : 3 colonnes. */
@media (min-width: 768px) and (max-width: 899px) {
	.sg-footer-infos.e-con {
		--flex-direction: row !important;
		flex-direction: row !important;
		flex-wrap: wrap;
		column-gap: 48px;
	}

	.sg-footer-infos.e-con > .e-con {
		--width: auto !important;
		flex: 1 1 28% !important;
	}
}

@media (min-width: 768px) and (max-width: 1024px) {
	body.sg-sans-devis .sg-footer-infos.e-con {
		--width: 100% !important;
		flex-wrap: nowrap !important;
	}

	body.sg-sans-devis .sg-footer-infos.e-con > .e-con {
		flex: 1 1 0% !important;
		min-width: 0;
	}
}

/* --------------------------------------------------------------------------
   Formulaires de devis : champs soulignés (SG/Field), libellés flottants du socle
   -------------------------------------------------------------------------- */
.sg-form {
	--pb-form-etiquette-gauche: -8px;
	--pb-form-demi-gouttiere: 12px;
	--pb-form-etiquette-fond: #fff;
	--pb-form-etiquette-texte: var(--sg-anthracite);
	--sg-form-texte: var(--sg-anthracite);
	--sg-form-invite: rgba(41, 40, 43, .6);
}

.sg-form--sombre {
	--pb-form-demi-gouttiere: 16px;
	--pb-form-etiquette-fond: var(--sg-noir);
	--pb-form-etiquette-texte: #fff;
	--sg-form-texte: #fff;
	--sg-form-invite: #fff;
}

.sg-form .elementor-field-group:has(.elementor-field-textual) > .elementor-field-label {
	border-color: transparent;
	box-shadow: none;
}

.sg-form .elementor-field-textual {
	min-height: 52px;
	padding: 18px 0 12px !important;
	font-size: 1rem;
	color: var(--sg-form-texte) !important;
	background: transparent !important;
	border-width: 0 0 1px !important;
	border-radius: 0 !important;
	transition: border-color .25s ease;
}

.sg-form textarea.elementor-field-textual {
	height: 104px;
	min-height: 104px;
	resize: vertical;
}

.sg-form--sombre textarea.elementor-field-textual {
	height: 110px;
}

.sg-form .elementor-field-textual::placeholder {
	color: var(--sg-form-invite);
	opacity: 1;
}

.sg-form .elementor-field-textual:focus {
	border-color: var(--sg-orange) !important;
	box-shadow: none !important;
}

.sg-form .elementor-select-wrapper select {
	padding-right: 24px !important;
}

.sg-form .elementor-select-wrapper .select-caret-down-wrapper {
	display: none;
}

.sg-form .elementor-select-wrapper::before {
	content: "";
	position: absolute;
	top: 50%;
	right: 4px;
	width: 8px;
	height: 8px;
	margin-top: -2px;
	border-right: 1.4px solid currentColor;
	border-bottom: 1.4px solid currentColor;
	color: var(--sg-form-texte);
	transform: translateY(-50%) rotate(45deg);
	pointer-events: none;
}

.sg-form select.is-vide {
	color: var(--sg-form-invite) !important;
}

.sg-form--sombre select option {
	color: var(--sg-anthracite);
}

.sg-form .elementor-field-type-acceptance {
	margin-top: 12px;
}

.sg-form .elementor-field-type-acceptance label {
	font-size: .875rem;
	line-height: 1.5;
	color: var(--sg-form-invite);
}

.sg-form .elementor-field-type-submit {
	margin-top: 14px;
}

.sg-form .elementor-field-type-submit .elementor-button {
	width: 100%;
	min-height: 48px;
	font-family: Michroma, sans-serif;
	font-size: .875rem;
	letter-spacing: .06em;
	text-transform: uppercase;
}

.sg-form--sombre .elementor-field-type-submit {
	flex: 0 0 auto;
	width: auto;
	max-width: 100%;
}

.sg-form--sombre .elementor-field-type-submit .elementor-button {
	width: auto;
}

.sg-form .elementor-message {
	margin-top: 16px;
	font-size: .875rem;
}

.sg-form--sombre .elementor-message {
	color: #fff;
}

/* --------------------------------------------------------------------------
   Pied de page
   -------------------------------------------------------------------------- */
.sg-footer-menu .elementor-nav-menu--dropdown a.elementor-item {
	justify-content: flex-start;
	padding-inline: 0 !important;
	letter-spacing: .06em;
	text-transform: uppercase;
}

.sg-footer-menu .elementor-nav-menu--dropdown {
	background: transparent !important;
}

.sg-footer-menu .elementor-nav-menu--dropdown a.elementor-item {
	transition: color .25s ease;
}

.sg-footer-menu .elementor-nav-menu--dropdown a.elementor-item:is(:hover, :focus-visible) {
	color: var(--sg-orange) !important;
}

.sg-adresse .elementor-heading-title br,
.sg-footer-coordonnees .elementor-heading-title br {
	display: inline !important;
}

.pb-icone-sociale .elementor-icon {
	color: #fff;
	transition: color .25s ease;
}

.pb-icone-sociale .elementor-icon svg {
	fill: none !important;
}

.pb-icone-sociale .elementor-icon:is(:hover, :focus-visible) {
	color: var(--sg-orange);
}

.sg-footer-bas .pb-footer-lien + .pb-footer-lien .elementor-heading-title::before {
	content: "-";
	margin: 0 .4em;
	color: rgba(255, 255, 255, .6);
}

.sg-signature-logia a {
	color: inherit;
	transition: color .25s ease;
}

.sg-signature-logia a:is(:hover, :focus-visible) {
	color: var(--sg-orange);
}

.sg-signature-logia strong {
	font-weight: 500;
}

@media (min-width: 768px) {
	body.sg-sans-devis .sg-footer-infos.e-con {
		--width: 100% !important;
		--flex-direction: row !important;
		flex-direction: row !important;
		flex-wrap: wrap;
		justify-content: space-between;
		column-gap: 64px;
	}

	body.sg-sans-devis .sg-footer-infos.e-con > .e-con {
		--width: auto !important;
		flex: 0 1 auto !important;
	}
}

/* Tablette paysage : bloc devis et coordonnées côte à côte. */
@media (min-width: 900px) and (max-width: 1024px) {
	.sg-footer-rangee.e-con {
		--flex-direction: row !important;
		flex-direction: row !important;
		gap: 48px !important;
	}

	.sg-footer-rangee .sg-devis-bloc.e-con {
		--width: 56% !important;
	}

	body:not(.sg-sans-devis) .sg-footer-rangee .sg-footer-infos.e-con {
		--width: 38% !important;
	}
}

body.error404 .sg-footer {
	border-top: 1px solid rgba(255, 255, 255, .12);
}

@media (max-width: 767px) {
	.sg-footer-bas .pb-footer-lien + .pb-footer-lien .elementor-heading-title::before {
		display: none;
	}
}

/* --------------------------------------------------------------------------
   Pages légales et plan du site : contenu saisi dans l'éditeur WordPress
   -------------------------------------------------------------------------- */
.sg-legal-contenu,
.sg-legal .pb-plan {
	font-size: 1rem;
	line-height: 1.65;
	color: var(--sg-anthracite);
}

.sg-legal-contenu h2 {
	margin: 56px 0 16px;
	font-size: 1.75rem;
	font-weight: 300;
	line-height: 1.2;
	letter-spacing: -.01em;
	color: var(--sg-anthracite);
}

.sg-legal-contenu > :first-child,
.sg-legal-contenu .wp-block-html:first-child h2 {
	margin-top: 0;
}

.sg-legal-contenu h3 {
	margin: 32px 0 12px;
	font-size: 1.25rem;
	font-weight: 400;
}

.sg-legal-contenu p,
.sg-legal-contenu ul {
	margin: 0 0 14px;
}

.sg-legal-contenu.elementor-widget,
.sg-legal .pb-plan.elementor-widget,
.sg-legal .sg-plan-bloc.e-con {
	max-width: 784px !important;
	padding-left: 24px;
}

/* Plan du site : deux rubriques de même niveau, deux listes au même style et au même rythme, page courante repérée. */
.sg-legal .pb-plan-du-site__titre,
.sg-legal .sg-plan-titre .elementor-heading-title {
	margin: 0 0 16px;
	font-size: 1.75rem !important;
	font-weight: 300 !important;
	line-height: 1.2 !important;
	letter-spacing: -.01em;
	color: var(--sg-anthracite);
}

.sg-legal .sg-plan-menu .elementor-nav-menu--dropdown a.elementor-item {
	padding: 7px 0 !important;
	line-height: 1.5;
	color: #A35000 !important;
	text-decoration: underline;
	text-decoration-color: rgba(163, 80, 0, .35);
	text-underline-offset: 3px;
	transition: color .25s ease, text-decoration-color .25s ease;
}

.sg-legal .sg-plan-menu .elementor-nav-menu--dropdown a.elementor-item:is(:hover, :focus-visible) {
	color: var(--sg-orange) !important;
	text-decoration-color: currentColor;
}

.sg-legal .pb-plan-du-site .current_page_item > a {
	color: var(--sg-anthracite);
	font-weight: 500;
	text-decoration: none;
}

/* Liens sur le beige : orange foncé (contraste 4,6:1), soulignement au survol. */
.sg-legal-contenu a,
.sg-legal .pb-plan a {
	color: #A35000;
	text-decoration: underline;
	text-decoration-color: rgba(163, 80, 0, .35);
	text-underline-offset: 3px;
	transition: color .25s ease, text-decoration-color .25s ease;
}

.sg-legal-contenu a:is(:hover, :focus-visible),
.sg-legal .pb-plan a:is(:hover, :focus-visible) {
	color: var(--sg-orange);
	text-decoration-color: currentColor;
}

.sg-plan-titre .elementor-heading-title {
	margin-bottom: 0;
}

@media (max-width: 1024px) {
	.sg-legal-contenu.elementor-widget,
	.sg-legal .pb-plan.elementor-widget,
	.sg-legal .sg-plan-bloc.e-con {
		padding-left: 0 !important;
	}
}

.sg-legal-contenu a[href^="http"] {
	white-space: nowrap;
}

.sg-legal .pb-plan-du-site__titre {
	margin-top: 40px;
}

.sg-legal .pb-plan:first-of-type .pb-plan-du-site__titre {
	margin-top: 0;
}

@media (max-width: 767px) {
	.sg-legal .pb-plan-du-site ul {
		gap: 0;
	}

	.sg-legal .sg-plan-menu .elementor-nav-menu--dropdown a.elementor-item {
		line-height: 1.65;
	}
}

@media (max-width: 767px) {
	.sg-legal .pb-plan a,
	.sg-legal .sg-plan-menu .elementor-nav-menu--dropdown a.elementor-item {
		display: inline-block;
		padding-block: 10px !important;
	}
}

.sg-legal-contenu strong {
	font-weight: 500;
}

/* --------------------------------------------------------------------------
   Responsive
   -------------------------------------------------------------------------- */
@media (max-width: 1024px) {
	.sg-hero-form {
		max-width: 640px;
	}

	.sg-engagements-grille {
		row-gap: 0 !important;
	}
}

@media (max-width: 767px) {
	.sg-materiaux-bande .sg-materiau {
		min-height: 300px;
	}

	.sg-footer-bas {
		text-align: center;
	}
}

/* Hero plein écran : plafonné sur les fenêtres très hautes (écran pivoté, captures pleine page), au-delà des tailles
   d'écran de la recette (1686 × 1269 au plus). */
@media (min-height: 1400px) {
	.e-con.pb-hero--ecran {
		min-height: 920px;
	}
}

.pb-reseaux.e-con {
	--width: auto !important;
	flex: none !important;
}

/* Mobile : prestations et matériaux en carrousel tactile bord à bord (rangée de 3 cartes et plus), amorce de la carte
   suivante à droite. */
@media (max-width: 767px) {
	.sg-prestations-grille .elementor-loop-container {
		display: grid !important;
		grid-auto-flow: column;
		grid-template-columns: none !important;
		grid-auto-columns: 78%;
		gap: 16px !important;
		margin-inline: -20px;
		padding: 0 20px 8px;
		overflow-x: auto;
		overscroll-behavior-x: contain;
		scroll-snap-type: x mandatory;
		scroll-padding-inline: 20px;
		scrollbar-width: none;
	}

	.sg-prestations-grille .elementor-loop-container::-webkit-scrollbar,
	.sg-materiaux-bande::-webkit-scrollbar {
		display: none;
	}

	.sg-prestations-grille .e-loop-item {
		scroll-snap-align: start;
	}

	.sg-materiaux-bande.e-con {
		flex-wrap: nowrap !important;
		overflow-x: auto;
		overscroll-behavior-x: contain;
		scroll-snap-type: x mandatory;
		scrollbar-width: none;
	}

	.sg-materiaux-bande .sg-materiau.e-con {
		--width: 78% !important;
		flex: 0 0 78% !important;
		scroll-snap-align: start;
	}
}