/* Page « Nous contacter » (spec 10) : chargée sur cette page seule, après style.css. Classes nl-contact-… */

/* Retours à la ligne imposés de la maquette : desktop et laptop seulement. */
@media (max-width: 1024px) {
	br.nl-br-desktop { display: none; }
}
@media (max-width: 1599px) {
	br.nl-br-1600 { display: none; }
}

/* ---- Hero : titre avec l'interlettrage de la maquette (1,33 px pour 80 px). */
.nl-contact-hero h1.elementor-heading-title { letter-spacing: .0166em; }

/* ---- Formulaire : champs de la maquette (bordure or 1 px, angles droits, REM Light 24/30, hauteur 48, texte à 22 px du bord). */
.nl-contact-form {
	--pb-form-etiquette-gauche: 14px;   /* padding gauche du champ (22) − 8 */
	--pb-form-demi-gouttiere: 9.5px;    /* moitié de l'espace entre les colonnes (19) */
	--pb-form-rayon-fichier: 0;
}
.nl-contact-form .elementor-field-group .elementor-field-textual {
	min-height: 48px;
	padding: 8px 22px;
}
.nl-contact-form .elementor-field-group .elementor-select-wrapper select {
	padding-right: 50px;
	appearance: none;
	-webkit-appearance: none;
	cursor: pointer;
}
.nl-contact-form .elementor-field-group textarea.elementor-field-textual {
	height: 428px;
	padding-top: 16px;
	resize: vertical;
}
/* Invites (placeholders, option vide des listes) en brun, comme la maquette. */
.nl-contact-form .elementor-field-textual::placeholder { color: var(--nl-brun); opacity: 1; }
.nl-contact-form select.is-vide { color: var(--nl-brun); }
/* Flèche des listes : triangle plein ▶ brun de la maquette, tourné vers le bas quand la liste est active. */
.nl-contact-form .elementor-field-group .elementor-select-wrapper::before {
	content: "";
	right: 13px;
	width: 15px;
	height: 19px;
	font-size: 0;
	text-shadow: none;
	background-color: var(--nl-brun);
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 15.297 19.093'%3E%3Cpath d='M0 19.093V0L15.297 9.547Z'/%3E%3C/svg%3E") center / contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 15.297 19.093'%3E%3Cpath d='M0 19.093V0L15.297 9.547Z'/%3E%3C/svg%3E") center / contain no-repeat;
	transition: transform .25s ease;
}
.nl-contact-form .elementor-field-group .elementor-select-wrapper:focus-within::before { transform: translateY(-50%) rotate(90deg); }
.nl-contact-form .elementor-select-wrapper .select-caret-down-wrapper { display: none; }
/* Survol et focus des champs : bordure or foncé. */
.nl-contact-form .elementor-field-group .elementor-field-textual { transition: border-color .25s ease; }
.nl-contact-form .elementor-field-group .elementor-field-textual:hover,
.nl-contact-form .elementor-field-group .elementor-select-wrapper select:hover,
.nl-contact-form .elementor-field-group .elementor-field-textual:focus,
.nl-contact-form .elementor-field-group .elementor-select-wrapper select:focus {
	border-color: var(--nl-or-fonce) !important;
	outline: none;
}
/* Ligne basse : case de confirmation à gauche, bouton « Envoyer » à droite (31 px sous le message). */
.nl-contact-form .elementor-field-type-acceptance,
.nl-contact-form .elementor-field-type-submit { margin-top: 10px; }
.nl-contact-form .elementor-field-type-acceptance { align-self: center; }
.nl-contact-form .elementor-field-type-acceptance label {
	font-size: 1rem !important;
	line-height: 1.4 !important;
}
.nl-contact-form .elementor-field-type-acceptance input[type="checkbox"] {
	width: 18px;
	height: 18px;
	margin-right: 10px;
	vertical-align: -3px;
	accent-color: var(--nl-or-fonce);
}
/* reCAPTCHA v3 invisible : le groupe ne prend pas de place ; badge masqué, remplacé par la mention de la maquette (autorisé par Google). */
.nl-contact-form .elementor-field-type-recaptcha_v3 {
	position: absolute !important;
	width: 0 !important;
	height: 0;
	margin: 0 !important;
	padding: 0 !important;
	overflow: hidden;
}
.grecaptcha-badge { visibility: hidden; }
.nl-contact-recaptcha a { color: inherit; text-decoration: none; }
.nl-contact-recaptcha a:hover,
.nl-contact-recaptcha a:focus-visible { color: var(--nl-or-fonce); text-decoration: underline; }
@media (max-width: 1599px) {
	.nl-contact-form .elementor-field-group .elementor-field-textual { min-height: 40px; padding: 6px 18px; }
	.nl-contact-form { --pb-form-etiquette-gauche: 10px; }
	.nl-contact-form .elementor-field-group textarea.elementor-field-textual { height: 320px; padding-top: 12px; }
}
@media (max-width: 1024px) {
	.nl-contact-form .elementor-field-group textarea.elementor-field-textual { height: 260px; }
}
@media (max-width: 767px) {
	.nl-contact-form .elementor-field-group textarea.elementor-field-textual { height: 200px; }
	.nl-contact-form .elementor-field-type-submit { margin-top: 4px; }
}

/* ---- Nous joindre directement : colonne photo fixe (667 px), texte qui prend le reste. */
@media (min-width: 1025px) {
	.nl-contact-joindre-photo.e-con { flex: 0 1 667px; min-width: 0; }
}
@media (min-width: 1025px) and (max-width: 1599px) {
	.nl-contact-joindre-photo.e-con { flex-basis: 500px; }
}
/* Pictos blancs de la maquette (SVG en currentColor : la couleur vient de color), centrés sur une colonne de 30 px. */
.nl-contact-coord .elementor-icon-list-icon {
	flex: 0 0 30px;
	width: 30px;
	justify-content: center;
	color: var(--e-global-color-blanc00);
	transition: color .3s ease;
}
.nl-contact-coord .elementor-icon-list-icon svg { flex: none; max-width: none; width: var(--nl-ic-l) !important; height: var(--nl-ic-h) !important; }
.nl-contact-coord .elementor-icon-list-item:nth-child(1) { --nl-ic-l: 22.6px; --nl-ic-h: 29.7px; }
.nl-contact-coord .elementor-icon-list-item:nth-child(2) { --nl-ic-l: 12.4px; --nl-ic-h: 37.2px; }
.nl-contact-coord .elementor-icon-list-item:nth-child(2) .elementor-icon-list-icon svg { margin-block: -3.6px; }
.nl-contact-coord .elementor-icon-list-item:nth-child(3) { --nl-ic-l: 29.7px; --nl-ic-h: 21.2px; }
.nl-contact-coord .elementor-icon-list-item:nth-child(4) { --nl-ic-l: 29.7px; --nl-ic-h: 29.7px; }
.nl-contact-coord .elementor-icon-list-item:hover .elementor-icon-list-icon { color: var(--e-global-color-secondary); }
@media (max-width: 1599px) {
	.nl-contact-coord .elementor-icon-list-icon { flex-basis: 24px; width: 24px; }
	.nl-contact-coord .elementor-icon-list-icon svg { width: calc(var(--nl-ic-l) * .8) !important; height: calc(var(--nl-ic-h) * .8) !important; }
	.nl-contact-coord .elementor-icon-list-item:nth-child(2) .elementor-icon-list-icon svg { margin-block: -3px; }
}

/* ---- Notre atelier en Ardèche : carte satellite sous le voile or (position absolue en desktop, au-dessus du texte ailleurs). */
.nl-contact-carte.e-con { position: relative; }
.nl-contact-carte .nl-contact-carte-img {
	inset: 0 !important;
	width: 100% !important;
	height: 100%;
}
.nl-contact-carte .nl-contact-carte-img img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: 0 0;
}
.nl-contact-atelier-texte.e-con { position: relative; }
@media (max-width: 1024px) {
	.nl-contact-carte .nl-contact-carte-img.elementor-absolute { position: relative !important; inset: auto !important; height: 420px; }
	.nl-contact-carte .nl-contact-carte-img img { object-position: 12% 46%; }
}
@media (max-width: 767px) {
	.nl-contact-carte .nl-contact-carte-img.elementor-absolute { height: 300px; }
	.nl-contact-carte .nl-contact-carte-img img { object-position: 14% 46%; }
}

/* ---- FAQ : filets or entre les questions (aucun avant la première ni après la dernière), réponses justifiées. */
.nl-contact-faq .logia-accordion__item:first-child .logia-accordion__trigger { padding-top: 0; }
.nl-contact-faq .logia-accordion__item:last-child { border-bottom-width: 0 !important; }
.nl-contact-faq .logia-accordion__trigger { justify-content: space-between; }
.nl-contact-faq .logia-accordion__content { text-align: justify; }
.nl-contact-faq .logia-accordion__content p { margin: 0; }
.nl-contact-faq .logia-accordion__content small { font-size: .8em; }
/* « + » de la maquette ; ouvert, il pivote en « × ». */
.nl-contact-faq .logia-accordion__icon-open svg { transform: rotate(45deg); }
@media (max-width: 767px) {
	.nl-contact-faq .logia-accordion__content { text-align: left; }
}

/* ---- Suivez nos chantiers : 3 réseaux, picto rond or au-dessus de l'adresse, un seul lien par réseau. */
.nl-contact-reseaux-liste .elementor-icon-list-items.elementor-inline-items {
	margin: 0 !important;
	justify-content: center;
	flex-wrap: wrap;
	gap: 28px 0;
}
.nl-contact-reseaux-liste .elementor-inline-items .elementor-icon-list-item {
	width: 420px;
	margin: 0 !important;
	justify-content: center;
}
.nl-contact-reseaux-liste .elementor-icon-list-item > a {
	flex-direction: column;
	align-items: center;
	gap: 16px;
}
.nl-contact-reseaux-liste .elementor-icon-list-icon { color: var(--e-global-color-primary); transition: color .3s ease; }
.nl-contact-reseaux-liste .elementor-icon-list-icon svg { width: 46px !important; height: 46px !important; }
.nl-contact-reseaux-liste .elementor-icon-list-item:hover .elementor-icon-list-icon { color: var(--e-global-color-secondary); }
@media (max-width: 1599px) {
	.nl-contact-reseaux-liste .elementor-inline-items .elementor-icon-list-item { width: auto; min-width: 315px; }
	.nl-contact-reseaux-liste .elementor-icon-list-item > a { gap: 12px; }
	.nl-contact-reseaux-liste .elementor-icon-list-icon svg { width: 36px !important; height: 36px !important; }
}
@media (max-width: 1024px) {
	.nl-contact-reseaux-liste .elementor-icon-list-items.elementor-inline-items { gap: 32px 48px; }
	.nl-contact-reseaux-liste .elementor-inline-items .elementor-icon-list-item { width: auto; }
}
@media (max-width: 767px) {
	.nl-contact-reseaux-liste .elementor-icon-list-items.elementor-inline-items { flex-direction: column; align-items: center; gap: 28px; }
}
/* Passe 1 */
@media (max-width: 767px) { .elementor-field-type-select select { font-size: 1rem !important; text-overflow: ellipsis; white-space: nowrap; overflow: hidden; padding-right: 40px !important; } }
.nl-contact-recaptcha, .nl-contact-recaptcha * { font-size: 1rem !important; line-height: 1.25 !important; }
@media (min-width: 768px) and (max-width: 1024px) {
	.nl-contact-reseaux-liste .elementor-icon-list-items { flex-wrap: nowrap !important; } .nl-contact-reseaux-liste .elementor-icon-list-item { flex: 1 1 0; min-width: 0; } .nl-contact-reseaux-liste .elementor-icon-list-text { overflow-wrap: anywhere; }
}
@media (max-width: 1024px) { .nl-contact-joindre-photo img { object-position: 31% 81% !important; } }
@media (min-width: 1600px) { .logia-accordion__title-text { max-width: 1005px; } }
@media (max-width: 1024px) { .nl-page-nous-contacter .nl-hero-page.e-con-full .nl-ariane { left: 0 !important; } }
@media (max-width: 767px) { .nl-page-nous-contacter .nl-hero-page.e-con-full .nl-ariane { left: -20px !important; } }