");
}
/* ============================================================
Formulaire de contact
============================================================ */
.wpcf7-form .wd-form-row {
display: flex;
gap: 60px;
margin-bottom: 35px;
}
.wpcf7-form .wd-form-col {
flex: 1 1 0;
min-width: 0;
}
.wpcf7-form .wd-form-row--full {
display: block;
}
/* Labels : style par défaut du site */
.wpcf7-form label {
display: block;
margin-bottom: 8px;
font-weight: bold;
text-transform: uppercase;
}
/* Champs texte, email, tel, textarea */
.wpcf7-form input[type="text"],
.wpcf7-form input[type="email"],
.wpcf7-form input[type="tel"],
.wpcf7-form textarea {
width: 100%;
height: auto !important;
line-height: normal;
box-sizing: border-box;
padding: 15px 25px !important;
border: 1px solid #a9a9a9 !important;
border-radius: 15px !important;
font-family: 'Avenir', sans-serif !important;
color: #333;
background-color: var(--couleur-5) !important;
background-image: none !important;
}
.wpcf7-form textarea {
min-height: 180px;
resize: vertical;
}
.wpcf7-form input::placeholder,
.wpcf7-form textarea::placeholder {
font-family: 'Avenir', sans-serif;
color: #999;
}
/* Responsive : on repasse en colonne sur mobile */
@media (max-width: 768px) {
.wpcf7-form .wd-form-row {
flex-direction: column;
gap: 20px;
}
}
/* ==========================================================================
Bloc FAQ projet
========================================================================== */
#bloc_projet {
display: flex;
gap: 60px;
padding: 0;
}
#bloc_projet > * {
padding: 0;
}
#bloc_projet > *:first-child {
flex: 0 0 265px;
max-width: 265px;
}
#bloc_projet > *:last-child {
flex: 1 1 915px;
max-width: 915px;
}
#bloc_projet h2.h2_blanc {
position: relative;
color: #fff;
font-family: 'Gotham Rounded';
font-size: 30px;
font-weight: bold;
padding-bottom: 36px;
margin-bottom: 36px;
}
#bloc_projet h2.h2_blanc::after {
content: "";
position: absolute;
left: 0;
bottom: 0;
/* transform: translateY(-50%); */
width: 40px;
height: 6px;
background-color: rgba(255, 255, 255, 0.65);
border-radius: 2px;
}
/* Responsive : les colonnes passent l'une sous l'autre
dès que l'espace disponible ne permet plus les 1240px (265 + 60 + 915) */
@media (max-width: 1240px) {
#bloc_projet {
flex-direction: column;
gap: 30px;
}
#bloc_projet > *:first-child,
#bloc_projet > *:last-child {
flex: 1 1 auto;
max-width: 100%;
width: 100%;
}
}
.sc-bloc-faq-liste {
display: flex;
flex-direction: column;
gap: 20px;
box-sizing: border-box;
}
.sc-bloc-faq-liste *,
.sc-bloc-faq-liste *::before,
.sc-bloc-faq-liste *::after {
box-sizing: border-box;
}
.sc-faq-item {
background: #fff;
border-radius: 30px;
padding: 40px 50px;
}
.sc-faq-item .sc-faq-item {
border: none;
padding: 0;
}
.sc-faq-question {
margin: 0;
}
.sc-faq-toggle {
width: 100%;
display: flex;
align-items: center;
justify-content: space-between;
gap: 16px;
background: none;
border: 0;
margin: 0;
padding: 0;
cursor: pointer;
text-align: left;
box-shadow: none !important;
font-family: 'Gotham Rounded', sans-serif;
font-size: 24px;
font-weight: 700;
color: var(--couleur-2);
}
.sc-faq-item--sans-reponse .sc-faq-toggle {
cursor: default;
}
.sc-faq-toggle:focus-visible {
outline: 2px solid var(--couleur-1);
outline-offset: 4px;
}
.sc-faq-question__texte {
flex: 1;
}
/* Icône +/- — picots SVG (picto-plus / picto-moins), taille native 45px.
Superposées et animées en fondu + légère rotation lors du clic. */
.sc-faq-toggle__icone {
position: relative;
flex-shrink: 0;
width: 45px;
height: 45px;
}
.sc-faq-icone-plus,
.sc-faq-icone-moins {
position: absolute;
inset: 0;
display: flex;
align-items: center;
justify-content: center;
width: 100%;
height: 100%;
transition: opacity 0.25s ease, transform 0.25s ease;
}
.sc-faq-icone-plus svg,
.sc-faq-icone-moins svg {
display: block;
width: 100%;
height: 100%;
}
.sc-faq-icone-plus {
opacity: 1;
transform: rotate(0deg);
}
.sc-faq-icone-moins {
opacity: 0;
transform: rotate(-90deg);
}
.sc-faq-item.is-open .sc-faq-icone-plus {
opacity: 0;
transform: rotate(90deg);
}
.sc-faq-item.is-open .sc-faq-icone-moins {
opacity: 1;
transform: rotate(0deg);
}
/* Panneau de réponse : ouverture/fermeture animées en hauteur via grid-template-rows
(pas de calcul JS, s'adapte automatiquement à la hauteur du contenu). */
.sc-faq-panel {
display: grid;
grid-template-rows: 0fr;
transition: grid-template-rows 0.35s ease;
}
.sc-faq-item.is-open .sc-faq-panel {
grid-template-rows: 1fr;
}
.sc-faq-panel[hidden] {
display: none;
}
.sc-faq-panel__inner {
overflow: hidden;
min-height: 0;
}
/* Filet de séparation question / réponse — uniquement présent quand il y a une réponse */
.sc-faq-separateur {
border: 0;
border-top: 1px solid #ccd3ea;
margin: 40px 0 !important;
}
.sc-faq-panel__contenu {
font-family: 'Avenir', sans-serif;
font-size: 20px;
font-weight: 400;
line-height: 1.6;
color: #000 !important;
}
.sc-faq-panel__contenu > *:first-child {
margin-top: 0;
}
.sc-faq-panel__contenu > *:last-child {
margin-bottom: 0;
}
/* Respecte la préférence système de réduction des animations */
@media (prefers-reduced-motion: reduce) {
.sc-faq-panel,
.sc-faq-icone-plus,
.sc-faq-icone-moins {
transition: none;
}
}
/* ---- Responsive ---- */
@media (max-width: 600px) {
.sc-bloc-faq-liste {
gap: 16px;
}
.sc-faq-item {
padding: 26px 24px;
border-radius: 24px;
}
.sc-faq-toggle {
font-size: 18px;
}
.sc-faq-toggle__icone {
width: 34px;
height: 34px;
}
.sc-faq-separateur {
margin: 24px 0;
}
.sc-faq-panel__contenu {
font-size: 17px;
}
}
.bloc-feuille {
position: relative;
padding-bottom: 250px;
}
.bloc-feuille::after {
content: '';
position: absolute;
right: 10px;
bottom: 30px;
width: 160px;
height: 185px; /* ratio natif du picto : 163.451 x 185.132 */
background-image: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='163.451'%20height='185.132'%20viewBox='0%200%20163.451%20185.132'%3E%3Cg%20opacity='0.28'%3E%3Cpath%20d='M80.42,69.456c28-2.674,54.151,10.653,71.487,33.289-13.124,25.547-36.531,43.606-64.531,46.28S36.337,140.625,19,117.988'%20transform='translate(9.163%2033.334)'%20fill='none'%20stroke='%23fff'%20stroke-linecap='round'%20stroke-linejoin='round'%20stroke-width='3.213'/%3E%3Cpath%20d='M91.2,91.546c-10.821,30.747-33.4,49.735-65.137,57.223C6.106,122.8-4.984,91.78,5.836,61.033S43.069,9.094,74.8,1.606C94.762,27.571,102.023,60.8,91.2,91.546Z'%20transform='translate(0.775%200.775)'%20fill='none'%20stroke='%23fff'%20stroke-linecap='round'%20stroke-linejoin='round'%20stroke-width='3.213'/%3E%3Cpath%20d='M28.955,60.424s-17,25.549-7.823,87.651'%20transform='translate(8.88%2029.141)'%20fill='none'%20stroke='%23fff'%20stroke-linecap='round'%20stroke-linejoin='round'%20stroke-width='3.213'/%3E%3C/g%3E%3C/svg%3E");
background-repeat: no-repeat;
background-size: contain;
pointer-events: none;
}
@media (max-width: 900px) {
.bloc-feuille::after {
width: 85px;
height: 96px;
left: 28px;
bottom: 20px;
}
}
/* ==========================================================================
Shortcode [carte_interactive_projet]
========================================================================== */
.sc-carte-interactive {
--sc-carte-couleur-fond-legende: #f1f8fe;
--sc-carte-rayon: 4px;
--sc-carte-largeur-legende: 240px;
/* Hauteur du header collant du site, pour que le défilement automatique
vers un calque (lien ?calque=xxx) n'arrive pas caché dessous. */
--sc-carte-decalage-defilement: 240px;
max-width: 1240px;
margin: 0 auto;
scroll-margin-top: var(--sc-carte-decalage-defilement);
display: grid;
grid-template-columns: var(--sc-carte-largeur-legende) 1fr;
grid-template-areas:
"legende carte"
"reset carte";
column-gap: 24px;
align-items: start;
}
/* -- Carte / calques empilés -------------------------------------------- */
.sc-carte-interactive__carte {
grid-area: carte;
position: relative;
width: 100%;
aspect-ratio: 1538 / 918;
overflow: hidden;
border-radius: var(--sc-carte-rayon);
background: #fff;
touch-action: pan-y; /* laisse défiler la page au doigt tant qu'on n'est pas zoomé */
cursor: default;
}
.sc-carte-interactive__carte.is-zoomed {
touch-action: none; /* le geste tactile sert alors à déplacer/zoomer la carte */
cursor: grab;
}
.sc-carte-interactive__carte.is-zoomed.is-dragging {
cursor: grabbing;
}
/* Conteneur réellement zoomé/déplacé : le cadre ci-dessus reste fixe et
rogne (overflow:hidden) tout ce qui dépasserait pendant le zoom. */
.sc-carte-interactive__stage {
position: absolute;
inset: 0;
width: 100%;
height: 100%;
transform-origin: 0 0;
transform: translate(0, 0) scale(1);
transition: transform 0.15s ease;
will-change: transform;
}
.sc-carte-interactive__calque {
position: absolute;
inset: 0;
width: 100%;
height: 100%;
object-fit: contain;
display: none;
-webkit-user-drag: none;
user-select: none;
}
.sc-carte-interactive__calque.is-active {
display: block;
}
/* -- Barre d'outils (zoom + plein écran) ---------------------------------- */
.sc-carte-interactive__toolbar {
position: absolute;
top: 10px;
right: 10px;
z-index: 5;
display: flex;
align-items: center;
gap: 6px;
}
/* Des , pas des