:root {
	--cookieadmin-primary-color: #001d39;
	--cookieadmin-primary-hover-color: #985e23;
	
	--cookieadmin-secondary-color: #0046b2;
	--cookieadmin-secondary-hover-color: #0065ff;
	
	--cookieadmin-txcolor: #0f172a;
	
	--cookieadmin-green-txtcolor: #3a8356;
	--cookieadmin-warning-txtcolor: #9c7930;
	--cookieadmin-red-txtcolor: #b55355;
	
	--cookieadmin-green-color: #15a448;
	--cookieadmin-warning-color: #e9b306;
	--cookieadmin-red-color: #dd2727;
}

/* Typography baseline for the banner, modal and reconsent button. Everything inside
   inherits from these roots instead of the theme's body (font, fluid size, line-height,
   color, letter-spacing). Any explicit value here beats inheritance, whatever the theme's specificity. */
.cookieadmin_law_container,
.cookieadmin_cookie_modal,
.cookieadmin_reconsent_wrap{
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
	font-size: 16px;
	font-weight: 400;
	font-style: normal;
	line-height: 1.5;
	letter-spacing: normal;
	word-spacing: normal;
	text-transform: none;
	text-align: left;
	color: #1f2937;
}

/*  Consent page css */

.cookieadmin_cookie_modal label, .cookieadmin_cookie_modal input {
	padding: 5px;
	margin-right: 5px;
	font-size: 15px;
}

.cookieadmin_cookie_modal label{
	font-weight: 501;
}

.cookieadmin_bottom{
	bottom:20px;
}

.cookieadmin_top{
	top: 20px;
}

.cookieadmin_right{
	right: 15px;
}

.cookieadmin_left{
	left:15px;
}


 
/* Modal animations  */
@keyframes cookieadmin_slideUp {
	from {
		transform: translateY(100%);
		opacity: 0;
	}
	to {
		transform: translateY(0);
		opacity: 1;
	}
}

@keyframes cookieadmin_slideSide {
	from {
		transform: translateX(-100%);
		opacity: 0;
	}
	to {
		transform: translateX(0);
		opacity: 1;
	}
}

/* Modal animations Ends */


/* Consent page css End*/


/* Website consent box  */

.cookieadmin_law_container{
	position: fixed;
	width: 25%;
	box-sizing: border-box;
	z-index: 99999;
	display: none;
}

.cookieadmin_law_container:focus{
	outline: none;
}

.cookieadmin_consent_btns{
	align-content: center;
	display: flex;
	justify-content: space-evenly;
	flex-wrap: wrap;
	gap: 8px;
}

/* Percentage widths below stay; the cap stops the box growing on very wide screens */
.cookieadmin_box{
	/*position: fixed;*/
	width: 25%;
	max-width: 440px;
	box-sizing: border-box;
	display: none;
}

.cookieadmin_notice_group{
	display: flex;
	flex-direction: column;
	gap: 10px; /* spacing between content and buttons */
	align-items: flex-start;
}


.cookieadmin_consent_inside{
	color: #1f2937;
	background-color: #ffffff;
	border: 1px solid #ffffff;
	padding:15px;
	border-radius: 4px;
	box-shadow:1px 3px 10px rgba(0, 0, 0, 0.2);
}

/* Title and notice are <p>s: scoped by ID so theme paragraph sizes/margins don't apply.
   No side padding, so text lines up with the buttons and links. */
.cookieadmin_law_container p#cookieadmin_notice_title{
	margin: 0 0 6px;
	padding: 0;
	font-size: 16px;
	font-weight: 700;
	line-height: 1.4;
}

.cookieadmin_law_container p#cookieadmin_notice{
	margin: 0;
	padding: 0;
	font-size: 14px;
	line-height: 22px;
}

.cookieadmin_notice_con{
	padding: 0;
	flex: 1;
}

/* Box layout: space between the notice and the buttons (footer layout uses the group's gap) */
.cookieadmin_consent_inside > .cookieadmin_consent_btns{
	margin-top: 12px;
}

.cookieadmin_cookie_modal{
	display: none;
	flex-direction: column;
	position: fixed;
	max-height: 80vh;
	background-color: #FFFFFF;
	border: 1px solid #F4F4F4;
	border-radius: 8px;
	box-shadow: 0 4px 8px rgba(0,0,0,0.2);
	z-index: 999999;
}

.cookieadmin_center{
	top: 10%;
	left: 22%;
	max-width: 60vw;
}

.cookieadmin_side{
	flex-direction: column;
	position: fixed;
	width: 35vw;
	bottom: 0px;
	animation: 0.5s ease-out forwards cookieadmin_slideSide;
	max-height: 100vh;
	left: 0px;
	top: 0px;
	border-radius: 0px;
}

.cookieadmin_down{
	position: fixed;
	max-width: 100%;
	max-height: 55vh;
	bottom: 0px;
	animation: 0.5s ease-out forwards cookieadmin_slideUp;
}

.cookieadmin_cookie_modal:focus{
	outline: none;
}

.cookieadmin_modal_overlay{
	display: none; 
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: rgba(0, 0, 0, 0.4); 
	z-index: 1000;
}

/* Centered, not baseline: the CSS-drawn close button has no text baseline */
.cookieadmin_mod_head{
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 12px;
	padding: 14px 20px;
	border-bottom: 1px solid #CCCCCC;
}

/* Close icon drawn in CSS, font-size 0 hides any glyph left in filtered templates.
   "all: unset" + (0,3,1) selector keeps theme button/hover styles out, same as the category buttons. */
.cookieadmin_cookie_modal .cookieadmin_mod_head button.cookieadmin_close_pref{
	all: unset;
	display: inline-block;
	position: relative;
	flex-shrink: 0;
	width: 32px;
	height: 32px;
	border-radius: 4px;
	color: #6b7280;
	font-size: 0;
	cursor: pointer;
	transition: color .15s, background-color .15s;
}

.cookieadmin_cookie_modal .cookieadmin_mod_head button.cookieadmin_close_pref::before,
.cookieadmin_cookie_modal .cookieadmin_mod_head button.cookieadmin_close_pref::after{
	content: "";
	position: absolute;
	top: 50%;
	left: 50%;
	width: 16px;
	height: 2px;
	background-color: currentColor;
	border-radius: 1px;
	transform: translate(-50%, -50%) rotate(45deg);
}

.cookieadmin_cookie_modal .cookieadmin_mod_head button.cookieadmin_close_pref::after{
	transform: translate(-50%, -50%) rotate(-45deg);
}

.cookieadmin_cookie_modal .cookieadmin_mod_head button.cookieadmin_close_pref:hover{
	color: #111827;
	background-color: rgba(0, 0, 0, 0.06);
}

.cookieadmin_cookie_modal .cookieadmin_mod_head button.cookieadmin_close_pref:focus-visible{
	outline: 2px solid var(--cookieadmin-secondary-color);
	outline-offset: 2px;
}

.cookieadmin_preference_title{
	margin: 0;
	font-size: 20px;
	font-weight: 700;
	line-height: 1.3;
}

/* 5px + the wrapper's 15px lines the intro up with the title's 20px */
.cookieadmin_preference_details{
	padding: 0px 5px;
}

/* break-word (not overflow:auto) so long URLs wrap instead of adding an inner scrollbar */
.cookieadmin_preference{
	padding: 10px 0px;
	font-size: 14px;
	line-height: 28px;
	overflow-wrap: break-word;
}

/* Admin-entered HTML: keep theme paragraph margins and link colors out */
.cookieadmin_cookie_modal .cookieadmin_preference p{
	margin: 0 0 8px;
	padding: 0;
	font-size: inherit;
	line-height: inherit;
}

.cookieadmin_cookie_modal .cookieadmin_preference p:last-child{
	margin-bottom: 0;
}

.cookieadmin_cookie_modal .cookieadmin_preference a{
	color: inherit;
	text-decoration: underline;
}

.cookieadmin_details_wrapper{
	padding: 0px 15px;
	height: calc(100% - 6%);
	overflow: auto;
	scrollbar-width: thin;
}

.cookieadmin_types{
	padding: 10px 10px;
	border-top: 1px solid #CCCCCC;
}

.cookieadmin_header{
	display: flex;
	justify-content: space-between;
}


/* Clickable header text, e.g. Pro's "Override GPC" label */
.cookieadmin_header label[for]{
	cursor: pointer;
}

/* Header labels get explicit displays scoped to .cookieadmin_header so theme rules
   like "label { display: block }" can't push them onto their own line */
.cookieadmin_header label.stitle{
	display: inline;
}

.cookieadmin_header .cookieadmin_remark{
	display:none;
	justify-self:right;
}

.cookieadmin_header .cookieadmin_act{
	display: inline;
	color: #1863dc;
}

/* Lines up with .cookieadmin_desc; the old 4rem right margin squeezed cards on phones */
.cookieadmin-modal-cookies-list{
	display:none;
	margin: 8px 20px 4px;
	font-size: 14px;
	text-align: left;
}

.cookieadmin-modal-cookies-list .cookieadmin-nocookie-cat{
	display: block;
	padding: 4px 0;
	font-size: 13px;
	font-weight: 600;
	text-align: center;
	opacity: 0.7;
}

.cookieadmin_desc{
	padding:5px 20px;
	font-size: 15px;
	padding-right: 4rem;
}

.cookieadmin_footer{
	left: 0px;
	padding: 15px;
	flex-wrap: wrap;
	width: 100%;
}

/* Padding matches the header */
.cookieadmin_modal_footer{
	display: flex;
	padding: 14px 20px;
	flex-wrap: wrap;
	gap: 8px;
	border-top: 1px solid #CCCCCC;
}

/* GPC block and links take their own row above/below the buttons */
.cookieadmin_modal_footer > :not(.cookieadmin_btn){
	flex-basis: 100%;
}

/* Side panel is narrow: stack everything. nowrap matters, a wrapping column
   overflows into extra columns beside the panel when height is limited. */
.cookieadmin_side .cookieadmin_modal_footer{
	flex-direction: column;
	flex-wrap: nowrap;
}

.cookieadmin_cookie_modal.cookieadmin_side .cookieadmin_modal_footer > *{
	flex: none;
}

/* Scoped to the containers so common theme rules (e.g. ".elementor-kit-N button") don't win.
   Colors stay admin-controlled via the inline styles set in consent.js. */
.cookieadmin_law_container button.cookieadmin_btn,
.cookieadmin_cookie_modal button.cookieadmin_btn{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex: 1 1 0;
	min-height: 40px;
	margin: 0;
	padding: 8px 16px;
	background-color: transparent;
	background-image: none;
	border: 1px solid rgba(0, 0, 0, 0.2);
	border-radius: 4px;
	box-shadow: none;
	color: #1863dc;
	font-family: inherit;
	font-size: 14px;
	font-weight: 600;
	line-height: 1;
	letter-spacing: normal;
	text-align: center;
	text-decoration: none;
	text-shadow: none;
	text-transform: none;
	text-wrap: auto;
	cursor: pointer;
	transition: filter .15s;
}

/* Footer buttons size to their labels so "Save My Preferences" doesn't wrap;
   they still fill the row. The banner keeps equal widths. */
.cookieadmin_modal_footer button.cookieadmin_btn{
	flex: 1 1 auto;
}

/* Banner box is narrow (25% of the screen at 1366px = ~338px): size buttons to their labels
   with tighter padding so "Accept All" stays on one line; they still fill the row. */
.cookieadmin_consent_inside > .cookieadmin_consent_btns button.cookieadmin_btn{
	flex: 1 1 auto;
	padding-left: 12px;
	padding-right: 12px;
}

.cookieadmin_law_container button.cookieadmin_btn:hover,
.cookieadmin_cookie_modal button.cookieadmin_btn:hover{
	filter: brightness(0.92);
}

.cookieadmin_law_container button.cookieadmin_btn:focus-visible,
.cookieadmin_cookie_modal button.cookieadmin_btn:focus-visible{
	outline: 2px solid var(--cookieadmin-secondary-color);
	outline-offset: 2px;
}

/* Category name + chevron in one accordion button. "all: unset" drops theme button styles;
   the selector (0,3,1) outranks state rules like ".elementor-kit-N button:hover".
   Scoped to .cookieadmin_header: Pro reuses this class for a shortcode button. */
.cookieadmin_types .cookieadmin_header button.cookieadmin_show_pref_cookies{
	all: unset;
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 5px 0;
	color: inherit;
	font: inherit;
	font-size: 15px;
	font-weight: 700;
	line-height: 1.4;
	cursor: pointer;
}

.cookieadmin_types .cookieadmin_header button.cookieadmin_show_pref_cookies::before{
	content: "";
	flex-shrink: 0;
	width: 7px;
	height: 7px;
	border-right: 2px solid currentColor;
	border-bottom: 2px solid currentColor;
	transform: rotate(-45deg);
	transition: transform .2s;
}

.cookieadmin_types .cookieadmin_header button.cookieadmin_show_pref_cookies.dwn::before{
	transform: rotate(45deg);
}

/* all: unset removes the outline, so the focus ring is added back */
.cookieadmin_types .cookieadmin_header button.cookieadmin_show_pref_cookies:focus-visible{
	outline: 2px solid var(--cookieadmin-secondary-color);
	outline-offset: 2px;
	border-radius: 2px;
}

/* Reconsent: all:unset drops theme button styles (min-height, hover/focus rules); the
   wrapper selector (0,2,2) outranks ".elementor-kit-N button:hover". Plain selector kept
   for templates filtered without the wrapper class. JS toggles display inline (none/block). */
button.cookieadmin_re_consent,
body .cookieadmin_reconsent_wrap button.cookieadmin_re_consent{
	all: unset;
	display: none;
	position: fixed;
	bottom: 15px;
	left: 15px;
	z-index: 99999;
	box-sizing: border-box;
	width: 50px;
	height: 50px;
	padding: 5px;
	border-radius: 50%;
	background-color: #374FD4;
	box-shadow: -4px 5px 10px rgba(0, 0, 0, 0.4);
	cursor: pointer;
	transition: filter .15s;
}

button.cookieadmin_re_consent:hover,
body .cookieadmin_reconsent_wrap button.cookieadmin_re_consent:hover{
	filter: brightness(0.92);
}

button.cookieadmin_re_consent:focus-visible,
body .cookieadmin_reconsent_wrap button.cookieadmin_re_consent:focus-visible{
	outline: 2px solid var(--cookieadmin-secondary-color);
	outline-offset: 3px;
}

/* Block + the button's 5px padding centres the 40px icon; theme img rules kept out */
.cookieadmin_re_consent img.cookieadmin_reconsent_img{
	display: block;
	width: 40px;
	height: 40px;
	max-width: none;
	margin: 0;
	padding: 0;
	border: 0;
	border-radius: 0;
	box-shadow: none;
}

/* Flat card: theme font, 4px corners like the buttons. Muted text uses opacity so it
   works on any admin-chosen modal background. */
.cookieadmin-cookie-card {
	margin: 0 0 8px;
	padding: 12px 14px;
	border: 1px solid rgb(187 187 187 / 12%);
	border-radius: 4px;
	text-align: left;
}

.cookieadmin-cookie-header {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	gap: 2px 12px;
	font-size: 14px;
}

.cookieadmin-cookie-name {
	font-weight: 600;
	word-break: break-word;
	overflow-wrap: anywhere;
}

.cookieadmin-cookie-duration {
	font-size: 13px;
	opacity: 0.75;
}

.cookieadmin-cookie-duration > b {
	font-weight: 600;
}

/* Scoped so theme paragraph margins/sizes don't apply */
.cookieadmin-cookie-card p.cookieadmin-cookie-description {
	margin: 6px 0 0;
	padding: 0;
	font-size: 13px;
	line-height: 1.5;
}

.cookieadmin-cookie-tags {
	display: flex;
	gap: 8px;
	margin-top: 8px;
}

.cookieadmin-tag {
	background: rgba(0, 0, 0, 0.06);
	padding: 2px 8px;
	border-radius: 4px;
	font-size: 12px;
}

/* Pro DPDP contact box. Keyed on the ID (not a new class) so it also restyles
   older Pro versions that still output the shared .cookieadmin-cookie-card class. */
#cookieadmin_dpdp_contact {
	margin: 4px 0 12px;
	padding: 12px 14px;
	background: rgba(0, 0, 0, 0.04);
	border: 1px solid rgba(0, 0, 0, 0.08);
	border-radius: 4px;
	box-shadow: none;
	font-family: inherit;
	font-size: 14px;
	line-height: 1.5;
	text-align: left;
}

#cookieadmin_dpdp_contact a {
	color: inherit;
	text-decoration: underline;
}

/* "Exercise your rights" link, the card's main action */
#cookieadmin_dpdp_contact > a {
	display: inline-block;
	margin-top: 6px;
	font-weight: 600;
}

/* Website consent box End*/





/* Checkbox switch Start */

/* Box matches the 34x21 slider; the modal's generic label/input padding is cancelled
   so the switch no longer overflows its box */
.cookieadmin_toggle,
.cookieadmin_cookie_modal .cookieadmin_toggle {
	position: relative;
	display: inline-block;
	flex-shrink: 0;
	width: 34px;
	height: 21px;
	margin: 0;
	padding: 0;
}

/* Hide the checkbox input */
.cookieadmin_toggle input,
.cookieadmin_cookie_modal .cookieadmin_toggle input{
	/* display: none; */
	position: absolute;
	opacity: 0;
	width: 0;
	height: 0;
	margin: 0;
	padding: 0;
}

/* Text for screen readers / a11y checkers only, so toggle labels aren't empty */
.cookieadmin_sr_only {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

/* Keyboard accessibility: When the checkbox is focused, add a visible outline to indicate focus. */
.cookieadmin_show_pref_cookies:focus-visible{
	outline: 1px solid #000;
}
.cookieadmin_toggle input:focus + .cookieadmin_slider {
    outline: 1px solid #000;
}
/* end keyboard accessibility */

/* Describe slider's look and position. */
.cookieadmin_slider {
	position: absolute;
	cursor: pointer;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	height: 21px;
	width: 34px;
	background-color: gray;
	transition: .4s;
	border-radius: 34px;
}

/* Describe the white ball's location 
  and appearance in the slider. */
.cookieadmin_slider:before {
	position: absolute;
	content: "";
	height: 15px;
	width: 15px;
	left: 3.2px;
	bottom: 3.2px;
	background-color: white;
	transition: .2s;
	border-radius: 50%;
}

/* Modify the slider's background color to 
  green once the checkbox has been selected. */
input:checked+.cookieadmin_slider {
	background-color: #3582c4;
}

/* When the checkbox is checked, shift the 
  white ball towards the right within the slider. */
input:checked+.cookieadmin_slider:before {
	transform: translateX(13px);
}

/* Checkbox switch End */

.cookieadmin_law_container .cookieadmin-poweredby{
margin-top: 10px;
}

.cookieadmin_modal_footer_links .cookieadmin-poweredby{
margin-left: auto;
}

.cookieadmin-poweredby a img{
height: 15px;
}

.cookieadmin-poweredby a{
color : unset;
cursor: pointer;
display: flex;
justify-content: center;
align-items: center;
font-size: 11px;
gap: 2px;
text-decoration: none;
}

.cookieadmin_modal_footer .cookieadmin-poweredby a{
justify-content: end;
}

#cookieadmin-gpc-toast{
display:flex;
visibility: hidden;
position: fixed;
bottom: 24px;
right: 24px;
color: #ffffff;
padding: 10px 14px;
border-radius: 6px;
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
align-items: center;
justify-content: space-between;
gap: 10px;
font-size: 14px;
z-index: 99999;
opacity: 0;
transform: translateY(20px);
transition: opacity 0.3s ease, transform 0.3s ease, visibility 0s 0.3s;
line-height:1.5;
}

#cookieadmin_gpc_override{
padding-bottom:10px;
}

/* Policy Links */
.cookieadmin_policy_link_box{
	display: flex;
	justify-content: space-around;
	gap: 4px 16px;
	margin-top: 8px;
	font-size: 13px;
	flex-wrap: wrap;
}

/* Same treatment as the modal links, so theme link colors don't apply */
.cookieadmin_law_container .cookieadmin_policy_link_box a{
	color: inherit;
	text-decoration: underline;
}

.cookieadmin_modal_policy_link_box{
	display: flex;
	gap: 4px 16px;
	font-size: 13px;
	flex-wrap: wrap;
}

/* Same treatment as the intro and DPDP links, so theme link colors don't apply */
.cookieadmin_cookie_modal .cookieadmin_modal_policy_link_box a{
	color: inherit;
	text-decoration: underline;
}

/* Footer gap handles spacing; the old 9px side margins pushed links out of line with the buttons */
.cookieadmin_modal_footer_links{
	display:flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content:space-between;
	gap: 8px 16px;
	margin-top: 4px;
}

/* Hidden when there are no policy links and "Powered by" is off (Pro) */
.cookieadmin_modal_footer_links:not(:has(*)){
	display: none;
}

/* CSS for phones only */
@media (max-width: 767px) {

	.cookieadmin_center{
		top: 10%;
		left: 5%;
		max-width: 90vw;
	}

	.cookieadmin_show_pref_cookies{
		font-size: 14px;
	}

	/* Even 16px on both sides; the footer bar keeps its 100% width */
	.cookieadmin_box{
		left: 16px;
		right: 16px;
		width: auto;
		max-width: none;
	}
	
	.cookieadmin_side{
		width: 100%;
	}
}

/* CSS for tablet */
@media (min-width: 768px) and (max-width: 991px) {

	.cookieadmin_box{
		width: 45%;
	}
}

/* CSS for small laptop */
@media (min-width: 992px) and (max-width: 1199px) {

	.cookieadmin_box{
		width: 35%;
	}
	
}
/* CSS for HD TV screens */
@media (min-width: 1200px) and (max-width: 1360px) {

	.cookieadmin_box{
		width: 30%;
	}
}

/* Desktop Layout */
@media (min-width: 768px) {
	.cookieadmin_notice_group {
		flex-direction: row;
		justify-content: space-between;
		align-items: center;
	}

	.cookieadmin_notice_con {
		flex: 1; /* take remaining space */
	}

	.cookieadmin_consent_btns {
		flex-shrink: 0;
	}
	
	/* Footer layout: the button group sizes to its content, so equal-width (flex-basis 0)
	   buttons would shrink and wrap their labels. Size them to their labels instead. */
	.cookieadmin_footer .cookieadmin_consent_btns button.cookieadmin_btn{
		flex: 0 0 auto;
	}
}

@media (max-width:480px){
	.cookieadmin_preference_title{
		font-size: 18px;
	}
	
	/* 28px leaves no room for the categories on phones */
	.cookieadmin_preference{
		line-height: 22px;
	}
	
	.cookieadmin_law_container button.cookieadmin_btn,
	.cookieadmin_cookie_modal button.cookieadmin_btn,
	.cookieadmin_consent_inside > .cookieadmin_consent_btns button.cookieadmin_btn{
		flex-basis: 100%;
	}
	
	.cookieadmin_modal_footer{
		padding: 12px 16px;
	}
}

@media (prefers-reduced-motion: reduce){
	.cookieadmin_law_container *, .cookieadmin_cookie_modal *{
		transition: none !important;
	}
}


.cookieadmin_remark, .cookieadmin_showmore { color: #1863dc !important; }input:checked+.cookieadmin_slider, input:disabled+.cookieadmin_slider { background-color: #3582C4 !important; }.cookieadmin_slider{ background-color: #808080 !important; }
/*# sourceURL=cookieadmin-style-inline-css */

/*
Theme Name: Chantier Timelapse
Theme URI: https://www.chantier-timelapse.fr
Author: Chantier Timelapse
Description: Thème bloc sur mesure pour Chantier Timelapse : timelapse et suivi de chantier par drone à Grenoble et en Isère. Tout le contenu est composé de blocs natifs, modifiables dans l'éditeur.
Version: 1.0.46
Requires at least: 6.6
Requires PHP: 8.0
License: GPL-2.0-or-later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: chantier-timelapse
Tags: block-theme, full-site-editing, business
*/

/* ── Palette client ─────────────────────────────────────────────── */
:root {
  --anthracite: #1C1F23;
  --beton: #2B2F35;
  --blanc-casse: #F2F0EB;
  --gris-clair: #A8ADB3;
  --jaune: #F5A623;

  /* jetons de page : fond clair, texte anthracite */
  --fond: var(--blanc-casse);
  --surface: #FFFFFF;
  --texte: var(--anthracite);
  --texte-doux: #5E646C;
  --texte-inactif: #8C9299;
  --accent: var(--jaune);
  --encre: var(--anthracite);
  --ligne: rgba(28, 31, 35, .13);
  --contour: rgba(28, 31, 35, .55);
  --lien-souligne: var(--jaune);
  --verre: rgba(242, 240, 235, .16);
  --verre-bord: rgba(242, 240, 235, .38);

  --marge: 48px;
  --rayon: 16px;
  --rayon-s: 12px;

  --t-hero: 80px;
  --t-bloc: 52px;
  --t-contact: 64px;
  --t-corps: 15px;
  --t-petit: 13px;

  --police: var(--wp--preset--font-family--manrope, 'Manrope', system-ui, sans-serif);
  --police-titre: var(--wp--preset--font-family--switzer, 'Switzer', 'Manrope', system-ui, sans-serif);

  /* flèche des boutons ronds (anthracite, et jaune sur fond anthracite) */
  --fleche: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%231C1F23' stroke-width='1.6'%3E%3Cpath d='M4 12 12 4M5.5 4H12v6.5'/%3E%3C/svg%3E");
  --fleche-jaune: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%23F5A623' stroke-width='1.6'%3E%3Cpath d='M4 12 12 4M5.5 4H12v6.5'/%3E%3C/svg%3E");
  --plus: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%231C1F23' stroke-width='1.6'%3E%3Cpath d='M8 3v10M3 8h10'/%3E%3C/svg%3E");
  --plus-clair: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%23F2F0EB' stroke-width='1.6'%3E%3Cpath d='M8 3v10M3 8h10'/%3E%3C/svg%3E");
  --coche: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%231C1F23' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m3.5 8.5 3 3 6-7'/%3E%3C/svg%3E");
}

/* Zones sombres : photos plein cadre, panneaux, en-tête posé sur la photo */
.hero, .entete, .panneau, .formulaire, .process, .plan, .bento-carte, .formule-phare, .exemple-budget {
  --fond: var(--anthracite);
  --surface: var(--beton);
  --texte: var(--blanc-casse);
  --texte-doux: var(--gris-clair);
  --texte-inactif: #7C8289;
  --ligne: rgba(242, 240, 235, .14);
  --contour: rgba(242, 240, 235, .7);
  --lien-souligne: transparent;
  color: var(--texte);
}

/* ── Bases ──────────────────────────────────────────────────────── */
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0; position: relative;
  background: var(--fond); color: var(--texte);
  font-family: var(--police); font-size: var(--t-corps); line-height: 1.6;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}
img { display: block; max-width: 100%; height: auto; }
h1, h2, h3, h4, p, ul, ol, figure, dl { margin: 0; }
a { color: inherit; text-decoration: none; }
h1, h2, h3 { font-weight: 300; hyphens: none; text-wrap: balance; }
strong { font-weight: 700; color: var(--texte); }
::selection { background: var(--accent); color: var(--encre); }
:where(a, button, input, select, textarea, summary, [tabindex]):focus-visible { outline: 3px solid var(--accent); outline-offset: 3px; border-radius: 6px; }

/* Espacement automatique de Gutenberg : coupé dans theme.json (blockGap 0),
   et ici seulement à spécificité nulle pour ne jamais écraser les marges des composants. */
:where(.wp-block-group) > :where(*), :where(.wp-block-buttons) { margin-block: 0; }
.wp-site-blocks > * { margin-block: 0; }
.wp-site-blocks { overflow-x: clip; }   /* le ruban incliné déborde volontairement des bords */
figure.wp-block-image, figure.wp-block-video, figure.wp-block-table { margin: 0; }
ul.wp-block-list { padding: 0; list-style: none; }

/* ── Boutons : pilule + rond fléché, séparés par un petit espace ─── */
.wp-block-buttons { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; }
/* le rond sort du lien : la place lui est réservée par le bloc bouton (le lien est à 100 % de largeur) */
.wp-block-buttons > .wp-block-button { padding-right: 58px; }
.wp-block-button .wp-block-button__link {
  position: relative;
  display: inline-flex; align-items: center; justify-content: center;
  height: 52px; padding: 0 30px;
  border: 1px solid transparent; border-radius: 999px;
  font-family: var(--police); font-size: 14px; font-weight: 600; line-height: 1;
  letter-spacing: .01em; text-transform: uppercase; white-space: nowrap;
  transition: background .25s, color .25s, border-color .25s;
}
.wp-block-button .wp-block-button__link::after {
  content: ''; position: absolute; top: -1px; right: -59px;
  width: 52px; height: 52px; border-radius: 50%;
  background: var(--accent) var(--fleche) center / 16px no-repeat;
  transition: transform .25s;
}
.wp-block-button .wp-block-button__link:hover::after { transform: rotate(45deg); }
.wp-block-button.b-plein .wp-block-button__link { background: var(--accent); color: var(--encre); }
.wp-block-button.b-contour .wp-block-button__link { background: none; border-color: var(--contour); color: var(--texte); }
.wp-block-button.b-contour .wp-block-button__link:hover { background: var(--accent); border-color: var(--accent); color: var(--encre); }
.wp-block-button.b-sombre .wp-block-button__link { background: var(--encre); color: var(--accent); }
.wp-block-button.b-sombre .wp-block-button__link::after { background-color: var(--encre); background-image: var(--fleche-jaune); }

/* ── En-tête posé sur la photo du bandeau ───────────────────────── */
.zone-entete { position: absolute; z-index: 20; top: var(--marge); left: var(--marge); right: var(--marge); }
.entete { position: relative; display: flex; align-items: center; justify-content: space-between; }
.entete .logo img { width: 240px; height: auto; }

.zone-entete .entete .menu { position: absolute; left: 50%; transform: translateX(-50%); }
.zone-entete .entete .menu .wp-block-navigation__container {
  display: flex; align-items: center; gap: 0; flex-wrap: nowrap;
  height: 46px; padding: 0 8px;
  border-radius: 999px;
  background: var(--verre);
  backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px);
}
.zone-entete .entete .menu .wp-block-navigation__container > .wp-block-navigation-item { position: relative; height: 46px; display: flex; align-items: center; }
/* WordPress donne aux liens « background-color: inherit » : le voile de la pilule se doublerait sous chaque lien */
.zone-entete .entete .menu .wp-block-navigation-item { background-color: transparent; }
.zone-entete .entete .menu .wp-block-navigation__container > .wp-block-navigation-item + .wp-block-navigation-item::before {
  content: ''; position: absolute; left: 0; top: 50%;
  width: 1px; height: 22px; transform: translateY(-50%);
  background: rgba(242, 240, 235, .35);
}
.zone-entete .entete .menu .wp-block-navigation__container > .wp-block-navigation-item > .wp-block-navigation-item__content {
  display: flex; align-items: center; height: 46px; padding: 0 26px;
  font-size: 14px; color: var(--texte); opacity: .9; white-space: nowrap;
}
.zone-entete .entete .menu .wp-block-navigation-submenu > .wp-block-navigation-item__content { padding-right: 6px; }
.zone-entete .entete .menu .wp-block-navigation__submenu-icon { margin: 0 20px 0 0; padding: 0; width: 12px; height: 12px; color: var(--texte); }
.zone-entete .entete .menu .wp-block-navigation__submenu-icon svg { width: 12px; height: 12px; stroke: currentColor; transition: transform .25s; }
.zone-entete .entete .menu .has-child:hover .wp-block-navigation__submenu-icon svg,
.zone-entete .entete .menu .has-child:focus-within .wp-block-navigation__submenu-icon svg { transform: rotate(180deg); }
.zone-entete .entete .menu .wp-block-navigation-item__content:hover { opacity: 1; color: var(--accent); }
.zone-entete .entete .menu .current-menu-item > .wp-block-navigation-item__content,
.zone-entete .entete .menu .current-menu-ancestor > .wp-block-navigation-item__content { opacity: 1; font-weight: 600; }

/* sous-menu Prestations */
.zone-entete .entete .menu .has-child .wp-block-navigation__submenu-container {
  top: calc(100% + 12px); left: 50%;
  min-width: 210px; padding: 8px;
  border: 1px solid var(--ligne); border-radius: var(--rayon-s);
  background: rgba(28, 31, 35, .92); color: var(--texte);
  box-shadow: 0 18px 40px rgba(0, 0, 0, .35);
  transform: translate(-50%, 6px);
  transition: opacity .2s, transform .2s, visibility .2s;
}
.zone-entete .entete .menu .has-child .wp-block-navigation__submenu-container::before { content: ''; position: absolute; left: 0; right: 0; top: -14px; height: 14px; }
.zone-entete .entete .menu .has-child:hover > .wp-block-navigation__submenu-container,
.zone-entete .entete .menu .has-child:focus-within > .wp-block-navigation__submenu-container { transform: translate(-50%, 0); }
.zone-entete .entete .menu .wp-block-navigation__submenu-container .wp-block-navigation-item__content {
  display: block; padding: 12px 16px; border-radius: 8px;
  font-size: 14px; color: var(--texte); white-space: nowrap;
}
.zone-entete .entete .menu .wp-block-navigation__submenu-container .wp-block-navigation-item__content:hover { background: rgba(242, 240, 235, .07); }

.entete .entete-cta > .wp-block-button { padding-right: 52px; }
.entete .entete-cta .wp-block-button__link { height: 46px; padding: 0 24px; font-size: 12px; }
.entete .entete-cta .wp-block-button__link::after { width: 46px; height: 46px; right: -53px; }

/* La pilule tient entre le logo et le bouton devis à partir de 1 200 px, sans « Accueil » (le logo y ramène).
   En dessous : bouton rond, placé après le bouton devis, et panneau plein écran (où « Accueil » reste). */
@media (min-width: 1200px) {
  .zone-entete .entete .menu .wp-block-navigation__container > .menu-accueil { display: none; }
  .zone-entete .entete .menu .wp-block-navigation__container > .menu-accueil + .wp-block-navigation-item::before { display: none; }
}
@media (min-width: 1200px) and (max-width: 1360px) {
  .zone-entete .entete .menu .wp-block-navigation__container > .wp-block-navigation-item > .wp-block-navigation-item__content { padding: 0 16px; }
  .zone-entete .entete .menu .wp-block-navigation-submenu > .wp-block-navigation-item__content { padding-right: 6px; }
  .zone-entete .entete .menu .wp-block-navigation__submenu-icon { margin-right: 12px; }
}
@media (max-width: 1199px) {
  .zone-entete .entete .menu { position: static; transform: none; order: 3; margin-left: 12px; }
  .zone-entete .menu .wp-block-navigation__responsive-container-open:not(.always-shown) { display: flex; }
  .zone-entete .menu .wp-block-navigation__responsive-container:not(.hidden-by-default):not(.is-menu-open) { display: none; }
  .entete .entete-cta { margin-left: auto; }
}

/* bouton du menu mobile et panneau ouvert */
.zone-entete .menu .wp-block-navigation__responsive-container-open {
  width: 46px; height: 46px; border-radius: 50%;
  align-items: center; justify-content: center;
  background: var(--accent); color: var(--encre);
}
.zone-entete .menu .wp-block-navigation__responsive-container-open svg { width: 22px; height: 22px; }
/* ── Menu mobile : panneau plein écran ──────────────────────────────
   Logo + fermeture ronde en haut, liens numérotés en grand, prestations en pastilles,
   devis / appel / e-mail en bas (bloc Boutons « menu-mobile-pied » du menu, masqué ailleurs). */
.zone-entete .menu .menu-mobile-pied { display: none; }
/* menu ouvert : l'animation d'arrivée de l'en-tête laisse une transformation qui enfermerait le
   panneau « fixe » dans l'en-tête, et l'en-tête doit passer devant tout le reste de la page */
.has-modal-open .zone-entete,
.zone-entete:has(.is-menu-open) { z-index: 100000; animation: none !important; transform: none !important; }

.wp-block-navigation.menu .wp-block-navigation__responsive-container.is-menu-open {
  padding: 24px;
  color: var(--blanc-casse) !important;
  background-color: var(--anthracite) !important;
  background-image:
    linear-gradient(rgba(242, 240, 235, .045) 1px, transparent 1px),
    linear-gradient(90deg, rgba(242, 240, 235, .045) 1px, transparent 1px);
  background-size: 40px 40px;
}
.wp-block-navigation.menu .is-menu-open .wp-block-navigation__responsive-close,
.wp-block-navigation.menu .is-menu-open .wp-block-navigation__responsive-dialog { display: flex; flex-direction: column; min-height: 100%; }
/* logo : celui du site (variable --ct-logo posée par functions.php) */
.wp-block-navigation.menu .is-menu-open .wp-block-navigation__responsive-dialog::before {
  content: ''; flex: none; width: 190px; height: 46px;
  background: var(--ct-logo) left center / contain no-repeat;
}
.wp-block-navigation.menu .wp-block-navigation__responsive-container-close {
  top: 0; right: 0; width: 46px; height: 46px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  background: var(--accent); color: var(--encre);
}
.wp-block-navigation.menu .wp-block-navigation__responsive-container-close svg { width: 22px; height: 22px; fill: currentColor; }
.wp-block-navigation.menu .is-menu-open .wp-block-navigation__responsive-container-content {
  flex: 1; display: flex; flex-direction: column; align-items: stretch; gap: 0; padding-top: 36px;
}
/* la liste porte aussi la classe « menu » : on annule l'ordre et la marge prévus pour le bouton rond */
.wp-block-navigation.menu .is-menu-open .wp-block-navigation__container {
  order: 0; margin-left: 0;
  width: 100%; height: auto; padding: 0; gap: 0; counter-reset: menu-mobile;
  flex-direction: column; align-items: stretch;
  background: none; backdrop-filter: none; -webkit-backdrop-filter: none;
}
.wp-block-navigation.menu .is-menu-open .wp-block-navigation__container > .wp-block-navigation-item {
  display: block; height: auto; counter-increment: menu-mobile;
  border-bottom: 1px solid rgba(242, 240, 235, .12);
}
.wp-block-navigation.menu .is-menu-open .wp-block-navigation__container > .wp-block-navigation-item::before { display: none; }
.wp-block-navigation.menu .is-menu-open .wp-block-navigation__container > .wp-block-navigation-item > .wp-block-navigation-item__content {
  display: flex; align-items: center; gap: 16px; width: 100%; height: auto; padding: 15px 0;
  font-family: var(--police-titre); font-size: 30px; font-weight: 600; line-height: 1.1; letter-spacing: -.02em;
  color: var(--blanc-casse); opacity: 1;
}
.wp-block-navigation.menu .is-menu-open .wp-block-navigation__container > .wp-block-navigation-item > .wp-block-navigation-item__content::before {
  content: counter(menu-mobile, decimal-leading-zero); min-width: 22px;
  font-family: var(--police); font-size: 12px; font-weight: 700; letter-spacing: .1em; color: var(--accent);
}
.wp-block-navigation.menu .is-menu-open .wp-block-navigation__container > .wp-block-navigation-item > .wp-block-navigation-item__content::after {
  content: ''; flex: none; width: 18px; height: 18px; margin-left: auto;
  background: var(--fleche-jaune) center / contain no-repeat; opacity: .55; transition: opacity .2s, transform .2s;
}
.wp-block-navigation.menu .is-menu-open .wp-block-navigation__container > .wp-block-navigation-item > .wp-block-navigation-item__content:hover::after { opacity: 1; transform: rotate(45deg); }
.wp-block-navigation.menu .is-menu-open .wp-block-navigation__container > .current-menu-item > .wp-block-navigation-item__content,
.wp-block-navigation.menu .is-menu-open .wp-block-navigation__container > .current-menu-ancestor > .wp-block-navigation-item__content { color: var(--accent); }
/* prestations en pastilles sous leur lien */
.wp-block-navigation.menu .is-menu-open .wp-block-navigation__submenu-icon { display: none; }
.wp-block-navigation.menu .is-menu-open .wp-block-navigation__submenu-container {
  position: static !important; display: flex !important; flex-direction: row !important; flex-wrap: wrap; gap: 8px;
  width: auto !important; min-width: 0 !important; height: auto !important; overflow: visible !important;
  opacity: 1 !important; visibility: visible !important;
  padding: 0 0 18px 38px !important; background: none !important; border: 0 !important; box-shadow: none !important; transform: none !important;
}
.wp-block-navigation.menu .is-menu-open .wp-block-navigation__submenu-container .wp-block-navigation-item { width: auto; }
.wp-block-navigation.menu .is-menu-open .wp-block-navigation__submenu-container .wp-block-navigation-item__content {
  display: inline-flex; align-items: center; height: 38px; padding: 0 16px;
  border: 1px solid rgba(242, 240, 235, .3); border-radius: 999px;
  font-family: var(--police); font-size: 15px; font-weight: 500; color: var(--blanc-casse);
}
.wp-block-navigation.menu .is-menu-open .wp-block-navigation__submenu-container .current-menu-item > .wp-block-navigation-item__content { border-color: var(--accent); background: var(--accent); color: var(--encre); }
/* bas du panneau : devis en grand, appel et e-mail côte à côte */
.wp-block-navigation.menu .is-menu-open .menu-mobile-pied {
  display: grid; grid-template-columns: 1fr 1fr; gap: 10px; width: 100%; margin-top: auto; padding-top: 32px;
}
.wp-block-navigation.menu .is-menu-open .menu-mobile-pied > .wp-block-button { padding-right: 0; }
.wp-block-navigation.menu .is-menu-open .menu-mobile-pied > .b-plein { grid-column: 1 / -1; padding-right: 58px; }
.wp-block-navigation.menu .is-menu-open .menu-mobile-pied .wp-block-button__link { width: 100%; height: 52px; }
.wp-block-navigation.menu .is-menu-open .menu-mobile-pied .b-contour .wp-block-button__link {
  gap: 10px; padding: 0 16px; border-color: rgba(242, 240, 235, .35); color: var(--blanc-casse); font-size: 13px;
}
.wp-block-navigation.menu .is-menu-open .menu-mobile-pied .b-contour .wp-block-button__link::after { display: none; }
.wp-block-navigation.menu .is-menu-open .menu-mobile-pied .b-contour .wp-block-button__link::before {
  content: ''; flex: none; width: 16px; height: 16px; background: center / contain no-repeat;
}
.wp-block-navigation.menu .is-menu-open .menu-mobile-pied .menu-appel .wp-block-button__link::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23F5A623' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M22 16.9v3a2 2 0 0 1-2.2 2 19.8 19.8 0 0 1-8.6-3.1 19.5 19.5 0 0 1-6-6A19.8 19.8 0 0 1 2.1 4.2 2 2 0 0 1 4.1 2h3a2 2 0 0 1 2 1.7c.1 1 .4 1.9.7 2.8a2 2 0 0 1-.5 2.1L8 9.9a16 16 0 0 0 6 6l1.3-1.3a2 2 0 0 1 2.1-.4c.9.3 1.8.6 2.8.7a2 2 0 0 1 1.7 2z'/%3E%3C/svg%3E");
}
.wp-block-navigation.menu .is-menu-open .menu-mobile-pied .menu-mail .wp-block-button__link::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23F5A623' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='2' y='4' width='20' height='16' rx='2'/%3E%3Cpath d='m22 7-10 6L2 7'/%3E%3C/svg%3E");
}
/* entrée en cascade des liens à l'ouverture */
@media (prefers-reduced-motion: no-preference) {
  .wp-block-navigation.menu .is-menu-open .wp-block-navigation__container > .wp-block-navigation-item,
  .wp-block-navigation.menu .is-menu-open .menu-mobile-pied { animation: menu-entree .5s cubic-bezier(.2, .6, .2, 1) both; }
  .wp-block-navigation.menu .is-menu-open .wp-block-navigation__container > .wp-block-navigation-item:nth-child(2) { animation-delay: .04s; }
  .wp-block-navigation.menu .is-menu-open .wp-block-navigation__container > .wp-block-navigation-item:nth-child(3) { animation-delay: .08s; }
  .wp-block-navigation.menu .is-menu-open .wp-block-navigation__container > .wp-block-navigation-item:nth-child(4) { animation-delay: .12s; }
  .wp-block-navigation.menu .is-menu-open .wp-block-navigation__container > .wp-block-navigation-item:nth-child(5) { animation-delay: .16s; }
  .wp-block-navigation.menu .is-menu-open .wp-block-navigation__container > .wp-block-navigation-item:nth-child(6) { animation-delay: .2s; }
  .wp-block-navigation.menu .is-menu-open .wp-block-navigation__container > .wp-block-navigation-item:nth-child(7) { animation-delay: .24s; }
  .wp-block-navigation.menu .is-menu-open .wp-block-navigation__container > .wp-block-navigation-item:nth-child(n+8) { animation-delay: .28s; }
  .wp-block-navigation.menu .is-menu-open .menu-mobile-pied { animation-delay: .32s; }
}
@keyframes menu-entree { from { opacity: 0; transform: translateY(18px); } to { opacity: 1; transform: none; } }
@media (max-height: 700px) {
  .wp-block-navigation.menu .is-menu-open .wp-block-navigation__container > .wp-block-navigation-item > .wp-block-navigation-item__content { padding: 11px 0; font-size: 25px; }
}

/* ── Bandeau d'entrée (hero) ────────────────────────────────────── */
.hero {
  position: relative;
  margin: 0;
  height: 800px;
  border-radius: 0;
  overflow: hidden;
  isolation: isolate;
  background: var(--anthracite);
}
/* WordPress 7 annule la marge haute du premier bloc (« :root :where(…) > :first-child ») :
   il faut deux classes pour la rétablir */
.wp-block-group.hero { margin-top: 0; }
/* accueil : bandeau en plein écran (bord à bord, sans coins arrondis, toute la hauteur de la fenêtre) ;
   la hauteur plancher garde la place du titre, des pastilles et des cartes qui défilent */
.home .hero:not(.hero-page) {
  margin: 0; border-radius: 0;
  height: calc(100vh - var(--wp-admin--admin-bar--height, 0px));
  height: calc(100svh - var(--wp-admin--admin-bar--height, 0px));
  min-height: 640px;
}
.home .zone-entete { top: var(--marge); left: var(--marge); right: var(--marge); }
@media (max-width: 960px) { .home .hero:not(.hero-page) { min-height: 760px; } }
@media (max-width: 480px) { .home .hero:not(.hero-page) { min-height: 740px; } }
/* bandeaux sans photo (404, pages légales) : fond de plan quadrillé */
.hero:is(.hero-404, .hero-court) {
  background-image:
    linear-gradient(rgba(242, 240, 235, .05) 1px, transparent 1px),
    linear-gradient(90deg, rgba(242, 240, 235, .05) 1px, transparent 1px);
  background-size: 48px 48px;
}
.hero.hero-court { height: 480px; }
.hero-404 { margin-bottom: var(--marge); }
.hero .hero-photo { position: absolute; inset: 0; z-index: -2; }
.hero .hero-photo img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 60%; }
/* vidéo de fond (accueil) : posée sur la photo, qui sert d'affiche tant que la lecture n'a pas démarré */
.hero .hero-video { position: absolute; inset: 0; z-index: -2; pointer-events: none; opacity: 0; transition: opacity 1.2s ease; }
.hero .hero-video video { display: block; width: 100%; height: 100%; object-fit: cover; }
.hero .hero-video.lecture { opacity: 1; }
.hero::before {
  content: ''; position: absolute; inset: 0; z-index: -1;
  background:
    linear-gradient(90deg, rgba(28, 31, 35, .68) 0%, rgba(28, 31, 35, .32) 50%, rgba(28, 31, 35, .05) 100%),
    linear-gradient(180deg, rgba(28, 31, 35, .4) 0%, rgba(28, 31, 35, 0) 40%, rgba(28, 31, 35, .4) 100%);
}

.hero-texte { position: absolute; top: 206px; left: var(--marge); max-width: 900px; }
.hero .hero-titre {
  font-family: var(--police-titre); font-size: var(--t-hero); font-weight: 600;
  line-height: 1.06; letter-spacing: -.025em; color: var(--texte);
}
.hero-accroche { margin-top: 22px; max-width: 560px; font-size: 20px; line-height: 1.5; text-wrap: pretty; }

.hero .hero-tags { position: absolute; left: var(--marge); bottom: var(--marge); display: flex; flex-wrap: wrap; gap: 10px; max-width: 400px; }
.hero-tags li, .tag {
  display: inline-flex; align-items: center; height: 40px; padding: 0 20px;
  border-radius: 999px;
  background: var(--verre); border: 1px solid var(--verre-bord);
  backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px);
  font-size: 14px; white-space: nowrap;
}

/* cartes des chantiers en cours, qui défilent (accueil) */
.hero-defile { position: absolute; left: 55%; right: 0; bottom: 40px; padding-top: 36px; overflow: hidden; }
.hero-defile::before, .hero-defile::after { position: absolute; top: 0; font-size: var(--t-petit); line-height: 18px; }
.hero-defile::before { content: attr(data-num); left: 0; }
.hero-defile::after {
  content: attr(data-total); left: 34px; width: 366px; text-align: right;
  background: linear-gradient(90deg, var(--accent) var(--progression, 33%), rgba(242, 240, 235, .3) var(--progression, 33%)) left center / calc(100% - 34px) 2px no-repeat;
  transition: background-size .6s;
}
.defile-piste { display: flex; gap: 16px; transition: transform .7s cubic-bezier(.6, 0, .2, 1); }
.carte-verre {
  flex: none; width: 380px;
  display: flex; gap: 16px; padding: 12px;
  border-radius: var(--rayon-s);
  background: var(--verre); border: 1px solid var(--verre-bord);
  backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px);
}
.carte-verre .wp-block-image img { width: 128px; height: 128px; object-fit: cover; border-radius: 8px; }
.carte-verre .carte-texte { display: flex; flex-direction: column; justify-content: space-between; padding: 4px 0; }
.carte-verre h3 { font-size: 22px; font-weight: 500; line-height: 1.3; }
.carte-verre p { font-size: var(--t-petit); opacity: .85; }

/* bandeau des pages intérieures */
.hero.hero-page { height: 720px; }
.hero .fil { position: absolute; top: 176px; left: var(--marge); font-size: 14px; opacity: .85; }
.hero .fil a:hover { color: var(--accent); }
.hero-page .hero-texte { top: 214px; max-width: 1000px; }
.hero-encart {
  position: absolute; right: var(--marge); bottom: var(--marge);
  width: 420px; padding: 24px;
  border-radius: var(--rayon-s);
  background: var(--verre); border: 1px solid var(--verre-bord);
  backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px);
}
.hero-encart p { font-size: var(--t-corps); line-height: 1.6; }
.hero-encart .wp-block-buttons { margin-top: 18px; }
.hero-encart .wp-block-buttons > .wp-block-button { padding-right: 52px; }
.hero-encart .wp-block-button__link { height: 46px; padding: 0 24px; font-size: 12px; }
.hero-encart .wp-block-button__link::after { width: 46px; height: 46px; right: -53px; }
.hero-404 .hero-404-boutons { margin-top: 32px; }

/* ── Éléments communs des sections ──────────────────────────────── */
/* repère : numéro dans un carré jaune, intitulé en capitales (signalétique de chantier) */
.repere { display: flex; align-items: center; gap: 12px; font-size: 12px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; }
.repere strong { display: inline-grid; place-items: center; width: 30px; height: 30px; background: var(--accent); color: var(--encre); font-size: 12px; letter-spacing: 0; }

.titre-bloc {
  margin-top: 20px; max-width: 760px;
  font-family: var(--police-titre); font-size: var(--t-bloc); font-weight: 600;
  line-height: 1.04; letter-spacing: -.028em; text-wrap: balance;
}
/* mot-clé surligné au marqueur jaune (un <em> natif, donc modifiable) */
.titre-bloc em { font-style: normal; padding: 0 .06em; background: linear-gradient(transparent 58%, var(--accent) 58%, var(--accent) 92%, transparent 92%); }
.process .titre-bloc em { background: none; color: var(--accent); }

.bloc-tete { display: grid; grid-template-columns: 1fr 380px; column-gap: 64px; align-items: end; }
.bloc-intro { font-size: var(--t-corps); line-height: 1.7; color: var(--texte-doux); }
.intro-texte p a, .faq-item p a, .zone-home-texte p a, .coord-valeur a {
  text-decoration: underline; text-decoration-color: var(--lien-souligne);
  text-decoration-thickness: 2px; text-underline-offset: 3px;
}

/* ── Ruban de chantier ──────────────────────────────────────────── */
.ruban {
  position: relative; z-index: 6;
  margin: -26px -24px 0;
  overflow: hidden;
  background: var(--accent); color: var(--encre);
  border-block: 6px solid transparent;
  border-image: repeating-linear-gradient(-45deg, var(--encre) 0 12px, var(--accent) 12px 24px) 6;
  transform: rotate(-1.2deg);
  box-shadow: 0 12px 30px rgba(28, 31, 35, .18);
}
.ruban .ruban-piste { display: flex; width: max-content; animation: defiler 45s linear infinite; }
.ruban-piste li {
  display: flex; align-items: center; gap: 28px;
  padding: 14px 0 14px 28px;
  font-family: var(--police-titre); font-size: 20px; font-weight: 600;
  text-transform: uppercase; letter-spacing: .01em; white-space: nowrap;
}
.ruban-piste li::after { content: ''; width: 10px; height: 10px; background: var(--encre); transform: rotate(45deg); }
@keyframes defiler { to { transform: translateX(-50%); } }

/* ── (01) Intro et chiffres ─────────────────────────────────────── */
.intro { padding: 104px var(--marge) 0; }
.intro-grille { display: grid; grid-template-columns: 1fr 400px; column-gap: 64px; align-items: end; }
.intro-texte p { font-size: var(--t-corps); line-height: 1.7; color: var(--texte-doux); }
.intro-texte .wp-block-buttons { margin-top: 24px; }
.chiffres { display: grid; grid-template-columns: repeat(4, 1fr); margin-top: 64px; border-top: 1px solid var(--ligne); }
.chiffres > .wp-block-group { padding: 0 24px; border-right: 1px solid var(--ligne); }
.chiffres > .wp-block-group:first-child { padding-left: 0; }
.chiffres > .wp-block-group:last-child { border-right: 0; }
.chiffres > .wp-block-group::before { content: ''; display: block; width: 28px; height: 4px; margin-bottom: 22px; background: var(--accent); }
.chiffre-valeur { font-family: var(--police-titre); font-size: 64px; font-weight: 600; line-height: 1; letter-spacing: -.03em; }
.chiffre-libelle { margin-top: 10px; max-width: 210px; font-size: var(--t-petit); line-height: 1.5; color: var(--texte-doux); }

/* ── (02) Liste typographique + photo au survol ─────────────────── */
.services { padding: 110px var(--marge) 0; }
.services-corps { display: grid; grid-template-columns: 1fr 42%; column-gap: 48px; margin-top: 48px; }
.services-liste { border-top: 1px solid var(--ligne); }
.services-item {
  position: relative;
  display: grid; grid-template-columns: 52px 250px 1fr 44px; align-items: center; column-gap: 20px;
  min-height: 118px; padding-right: 8px;
  border-bottom: 1px solid var(--ligne);
  transition: padding .35s cubic-bezier(.2, .6, .2, 1);
}
.services-item::before { content: ''; position: absolute; left: 0; top: -1px; bottom: -1px; width: 0; background: var(--accent); transition: width .35s cubic-bezier(.2, .6, .2, 1); }
.services-liste:not(.services-texte) .services-item::after {
  content: ''; position: absolute; right: 8px; top: 50%; margin-top: -22px;
  width: 44px; height: 44px; border-radius: 50%;
  border: 1px solid var(--contour);
  background: transparent var(--fleche) center / 14px no-repeat;
  transition: background-color .3s, border-color .3s;
}
.services-num { font-size: 13px; font-weight: 700; color: var(--texte-doux); }
.services-item .services-nom { font-family: var(--police-titre); font-size: 34px; font-weight: 600; letter-spacing: -.02em; line-height: 1.1; color: var(--texte-inactif); transition: color .3s; }
.services-nom a::after { content: ''; position: absolute; inset: 0; }   /* toute la ligne est cliquable */
.services-desc { font-size: 14px; line-height: 1.55; color: var(--texte-doux); }
.services-item.actif { padding-left: 22px; }
.services-item.actif::before { width: 6px; }
.services-item.actif .services-nom { color: var(--texte); }
.services-liste:not(.services-texte) .services-item.actif::after { background-color: var(--accent); border-color: var(--accent); }
.services-texte .services-item { grid-template-columns: 52px 300px 1fr; }
.services-texte .services-item .services-nom { font-size: 26px; }
.services-visuel { position: relative; overflow: hidden; border-radius: var(--rayon-s); min-height: 474px; }
.services-visuel .wp-block-image { position: absolute; inset: 0; opacity: 0; transform: scale(1.05); transition: opacity .6s ease, transform 1.2s cubic-bezier(.2, .6, .2, 1); }
.services-visuel .wp-block-image img { width: 100%; height: 100%; object-fit: cover; }
.services-visuel .wp-block-image.actif { opacity: 1; transform: none; }

/* ── (03) Réalisations en mosaïque ──────────────────────────────── */
.realisations-bento { padding: 110px var(--marge) 0; }
.bento { display: grid; grid-template-columns: 1.6fr 1fr 1fr; grid-template-rows: 300px 250px; gap: 16px; margin-top: 48px; }
.bento-carte {
  position: relative; overflow: hidden; isolation: isolate;
  display: flex; align-items: flex-end; padding: 24px;
  border-radius: var(--rayon-s);
}
.bento-carte .wp-block-image { position: absolute; inset: 0; z-index: -2; }
.bento-carte .wp-block-image img { width: 100%; height: 100%; object-fit: cover; transition: transform 1.2s cubic-bezier(.2, 0, .2, 1); }
.bento-carte::before { content: ''; position: absolute; inset: 0; z-index: -1; background: linear-gradient(180deg, rgba(28, 31, 35, 0) 40%, rgba(28, 31, 35, .78) 100%); }
.bento-carte:hover .wp-block-image img { transform: scale(1.05); }
.bento-carte h3 a::after { content: ''; position: absolute; inset: 0; }   /* toute la carte est cliquable */
.bento-grande { grid-row: 1 / span 2; }
.lieu { display: inline-flex; align-items: center; gap: 8px; font-size: 11px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; }
.lieu::before { content: ''; width: 8px; height: 8px; background: var(--accent); }
.bento-legende h3 { margin-top: 8px; font-family: var(--police-titre); font-size: 24px; font-weight: 600; letter-spacing: -.01em; line-height: 1.15; }
.bento-grande .bento-legende h3 { font-size: 34px; }
.bento-legende p:not(.lieu) { margin-top: 8px; max-width: 460px; font-size: 14px; line-height: 1.55; opacity: .85; }
.bento-cta {
  grid-column: 2 / span 2; grid-row: 2;
  position: relative; overflow: hidden;
  display: flex; flex-direction: column; justify-content: space-between;
  padding: 28px 32px;
  border-radius: var(--rayon-s);
  background: var(--accent); color: var(--encre);
}
.bento-cta::after {
  content: ''; position: absolute; right: 0; top: 0; width: 150px; height: 150px;
  background: repeating-linear-gradient(-45deg, var(--encre) 0 12px, transparent 12px 24px);
  clip-path: polygon(0 0, 100% 0, 100% 100%);
}
.bento-cta-haut { font-size: 12px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; }
.bento-cta-texte { max-width: 480px; font-family: var(--police-titre); font-size: 32px; font-weight: 600; line-height: 1.08; letter-spacing: -.02em; }

/* ── (04) Frise sur fond de plan quadrillé ──────────────────────── */
.process, .plan {
  margin-top: 110px; padding: 100px var(--marge) 110px;
  background-color: var(--anthracite);
  background-image:
    linear-gradient(rgba(242, 240, 235, .05) 1px, transparent 1px),
    linear-gradient(90deg, rgba(242, 240, 235, .05) 1px, transparent 1px);
  background-size: 48px 48px;
}
.frise { position: relative; display: grid; grid-template-columns: repeat(4, 1fr); column-gap: 32px; margin-top: 64px; padding-top: 48px; }
.frise::before, .frise::after { content: ''; position: absolute; left: 0; right: 0; top: 14px; height: 2px; }
.frise::before { background: rgba(242, 240, 235, .16); }
.frise::after { background: var(--accent); transform-origin: left; transition: transform 1.8s cubic-bezier(.2, .6, .2, 1) .2s; }
.frise-etape { position: relative; }
.frise-etape::before { content: ''; position: absolute; top: -45px; left: 0; width: 18px; height: 18px; border-radius: 50%; background: var(--anthracite); border: 3px solid var(--accent); }
.frise-num { font-family: var(--police-titre); font-size: 56px; font-weight: 600; line-height: 1; letter-spacing: -.03em; color: transparent; -webkit-text-stroke: 1.5px var(--blanc-casse); }
.frise-etape h3 { margin-top: 18px; font-family: var(--police-titre); font-size: 24px; font-weight: 600; }
.frise-etape p:not(.frise-num) { margin-top: 10px; max-width: 280px; font-size: 14px; line-height: 1.65; color: var(--texte-doux); }

/* ── (05) Zone d'intervention ───────────────────────────────────── */
.zone-home { display: grid; grid-template-columns: 1fr 44%; column-gap: 64px; padding: 110px var(--marge) 0; }
.coordonnees-gps { margin-top: 18px; font-size: 12px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--texte-doux); }
.zone-home-texte > p:not(.repere):not(.coordonnees-gps) { margin-top: 18px; max-width: 640px; font-size: var(--t-corps); line-height: 1.75; color: var(--texte-doux); }
.zone-home-texte strong { font-weight: 600; }
.communes { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 28px; }
.communes li {
  display: inline-flex; align-items: center; height: 38px; padding: 0 18px;
  border-radius: 999px; border: 1px solid var(--contour);
  font-size: 14px; font-weight: 500;
}
.communes li:first-child { background: var(--texte); border-color: var(--texte); color: var(--fond); }
.zone-home .zone-home-photo { position: relative; min-height: 460px; overflow: hidden; border-radius: var(--rayon-s); }
.zone-home .zone-home-photo img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.zone-home .zone-home-photo figcaption {
  position: absolute; left: 20px; bottom: 20px; margin: 0; padding: 8px 14px;
  background: var(--accent); color: var(--encre);
  font-size: 12px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; text-align: left;
}

/* ── Bandeau d'une page au titre long (Zone d'intervention, 1.0.41) ─ */
/* titre plus petit (classe ajoutée au widget Titre) pour garder l'accroche au-dessus de l'encart ;
   pastilles sur une seule ligne (elementor.css les limite à 400 px) */
.hero-titre.hero-titre-long { font-size: clamp(34px, 4.6vw, 68px); }
.elementor .e-con.hero > .elementor-widget.hero-tags { max-width: min(640px, calc(100% - 420px - 4 * var(--marge))); }
@media (max-width: 960px) { .elementor .e-con.hero > .elementor-widget.hero-tags { max-width: none; } }

/* ── Carte de France de la zone d'intervention (1.0.40) ─────────── */
/* texte (widget Éditeur de texte .carte-zone-texte) à gauche, carte SVG (widget HTML .carte-zone-carte) à droite.
   Survoler un département de la liste l'éclaire sur la carte (:has, sans script). */
.carte-zone { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.08fr); column-gap: 64px; align-items: center; padding: 110px var(--marge) 0; }
.carte-zone-texte > p:not(.repere) { margin-top: 18px; max-width: 560px; font-size: var(--t-corps); line-height: 1.75; color: var(--texte-doux); }
.carte-deps { margin: 28px 0 0; padding: 0; list-style: none; border-top: 1px solid var(--ligne); }
.carte-deps li {
  display: grid; grid-template-columns: 44px 1fr; column-gap: 16px; align-items: center;
  padding: 12px 10px; border-bottom: 1px solid var(--ligne); transition: background .2s;
}
.carte-deps li:hover { background: var(--surface); }
.carte-deps .dep-num {
  grid-row: span 2; display: grid; place-items: center; width: 44px; height: 44px;
  background: var(--accent); color: var(--encre); font-size: 14px; font-weight: 800; letter-spacing: .02em;
}
.carte-deps .dep-nom { font-family: var(--police-titre); font-size: 19px; font-weight: 600; line-height: 1.2; letter-spacing: -.01em; }
.carte-deps .dep-villes { font-size: var(--t-petit); line-height: 1.5; color: var(--texte-doux); }

.carte-cadre {
  position: relative; padding: 28px 28px 20px; border-radius: var(--rayon);
  background-color: var(--anthracite);
  background-image: linear-gradient(rgba(242, 240, 235, .04) 1px, transparent 1px), linear-gradient(90deg, rgba(242, 240, 235, .04) 1px, transparent 1px);
  background-size: 24px 24px; background-position: -1px -1px;
}
.carte-france { display: block; width: 100%; height: auto; }
.carte-france .fond { fill: var(--beton); stroke: rgba(242, 240, 235, .16); stroke-width: .7; stroke-linejoin: round; }
.carte-france .dep { fill: var(--accent); stroke: var(--anthracite); stroke-width: 1.1; stroke-linejoin: round; transition: fill .2s; cursor: default; }
.carte-france .dep:hover,
.carte-zone:has(.d38:hover) .dep-38, .carte-zone:has(.d73:hover) .dep-73, .carte-zone:has(.d74:hover) .dep-74,
.carte-zone:has(.d26:hover) .dep-26, .carte-zone:has(.d05:hover) .dep-05 { fill: var(--blanc-casse); }
.carte-france .numeros text { fill: var(--encre); font-family: var(--police); font-size: 10px; font-weight: 800; text-anchor: middle; dominant-baseline: central; pointer-events: none; }
.carte-france .base-point { fill: var(--blanc-casse); stroke: var(--anthracite); stroke-width: 2; }
.carte-france .base-onde { fill: none; stroke: var(--blanc-casse); stroke-width: 1.5; transform-box: fill-box; transform-origin: center; animation: carte-onde 2.4s ease-out infinite; }
@keyframes carte-onde { from { opacity: .9; transform: scale(1); } to { opacity: 0; transform: scale(4); } }
@media (prefers-reduced-motion: reduce) { .carte-france .base-onde { animation: none; opacity: 0; } }
.carte-legende {
  display: flex; flex-wrap: wrap; gap: 6px 22px; margin-top: 14px; padding-top: 14px; border-top: 1px solid rgba(242, 240, 235, .14);
  font-size: 11px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--gris-clair);
}
.carte-legende span { display: inline-flex; align-items: center; gap: 8px; }
.carte-legende .leg-zone::before { content: ''; width: 10px; height: 10px; background: var(--accent); }
.carte-legende .leg-base::before { content: ''; width: 9px; height: 9px; border-radius: 50%; background: var(--blanc-casse); }

/* ── Questions fréquentes (blocs « Détails » natifs) ────────────── */
.faq { display: grid; grid-template-columns: 48% 1fr; padding: 110px var(--marge); }
.faq .titre-bloc { font-size: 40px; }
.faq-intro > p:last-child { margin-top: 22px; max-width: 380px; font-size: var(--t-petit); line-height: 1.7; color: var(--texte-doux); }
.faq-intro > p:last-child a { color: var(--texte); text-decoration: underline; text-decoration-color: var(--lien-souligne); text-decoration-thickness: 2px; text-underline-offset: 4px; }
.faq-liste { counter-reset: question; }
.faq-liste .faq-item { border-bottom: 1px solid var(--ligne); transition: background .35s; }
.faq-liste .faq-item summary {
  position: relative; display: block; list-style: none; cursor: pointer;
  padding: 24px 96px 24px 28px;
  font-size: 20px; font-weight: 500; line-height: 1.35;
}
.faq-liste .faq-item summary::-webkit-details-marker { display: none; }
.faq-liste .faq-item summary::before {
  counter-increment: question; content: "Q." counter(question, decimal-leading-zero);
  display: block; margin-bottom: 6px;
  font-size: 11px; font-weight: 700; letter-spacing: .12em; color: var(--texte-doux);
}
.faq-liste .faq-item summary::after {
  content: ''; position: absolute; right: 28px; top: 50%; margin-top: -22px;
  width: 44px; height: 44px; border-radius: 50%;
  border: 1px solid var(--contour);
  background: transparent var(--plus) center / 14px no-repeat;
  transition: transform .3s, background-color .3s, border-color .3s;
}
.faq-liste .faq-item summary:hover::after { border-color: var(--accent); }
.faq-liste .faq-item > p { padding: 0 100px 28px 28px; font-size: var(--t-corps); line-height: 1.7; color: var(--texte-doux); }
.faq-liste .faq-item[open] { background: var(--surface); border-radius: var(--rayon-s); border-bottom-color: transparent; }
.faq-liste .faq-item[open] summary::after { transform: rotate(45deg); background-color: var(--accent); border-color: var(--accent); }

/* ── Tarifs : section du calculateur (styles du calculateur : assets/calculateur.css) ── */
.tarifs { padding: 110px var(--marge) 0; }
.tarifs > .ctc { margin-top: 48px; }

/* ── Pages intérieures : atouts sur fond clair ──────────────────── */
.section-atouts { padding: 110px var(--marge) 0; }
.atouts { display: grid; grid-template-columns: repeat(4, 1fr); gap: 24px; margin-top: 48px; }
.atout .wp-block-image img { width: 100%; height: 320px; object-fit: cover; border-radius: var(--rayon-s); }
.atout .wp-block-image.produit img { object-fit: contain; padding: 40px 28px; background: var(--surface); }
.atout-num { display: inline-grid; place-items: center; width: 30px; height: 30px; margin-top: 20px; background: var(--accent); color: var(--encre); font-size: 12px; font-weight: 700; }
.atout h3 { margin-top: 6px; font-size: 20px; font-weight: 500; line-height: 1.3; }
.atout p:not(.atout-num) { margin-top: 10px; font-size: var(--t-petit); line-height: 1.65; color: var(--texte-doux); }

/* ── Matériel : fiche caméra, drones, tableau ───────────────────── */
.fiche { display: grid; grid-template-columns: 48% 1fr; align-items: start; }
.fiche-texte > p:not(.repere) { margin-top: 20px; max-width: 520px; font-size: var(--t-corps); line-height: 1.7; color: var(--texte-doux); }
.fiche .fiche-visuel {
  margin-top: 40px; margin-right: 64px; height: 380px; padding: 40px;
  border-radius: var(--rayon-s);
  background: radial-gradient(ellipse at 50% 60%, rgba(242, 240, 235, .1), rgba(242, 240, 235, .02) 70%);
}
.fiche .fiche-visuel img { width: 100%; height: 100%; object-fit: contain; }
.specs { display: grid; grid-template-columns: 1fr 1fr; gap: 44px 40px; padding-top: 6px; }
.specs h3 { font-family: var(--police-titre); font-size: 18px; font-weight: 600; }
.specs ul { margin-top: 12px; }
.specs li { padding: 12px 0; border-bottom: 1px solid var(--ligne); font-size: var(--t-corps); line-height: 1.45; color: var(--texte-doux); }

.drones { padding: 110px var(--marge) 0; }
.appareils { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; margin-top: 48px; }
.appareil { padding: 28px; border-radius: var(--rayon); background: var(--surface); }
.appareil .appareil-visuel { height: 220px; padding: 24px; }
.appareil .appareil-visuel img { width: 100%; height: 100%; object-fit: contain; }
.appareil-usage { display: inline-flex; align-items: center; height: 30px; padding: 0 14px; margin-top: 8px; border-radius: 999px; border: 1px solid var(--contour); font-size: 12px; font-weight: 500; }
.appareil h3 { margin-top: 16px; font-size: 22px; font-weight: 600; line-height: 1.3; }
.appareil > p:not(.appareil-usage) { margin-top: 8px; font-size: var(--t-petit); line-height: 1.65; color: var(--texte-doux); }
.appareil .appareil-specs { margin-top: 20px; }
.appareil .appareil-specs table { width: 100%; border-collapse: collapse; }
.appareil .appareil-specs :is(td, th) { padding: 11px 0; border: 0; border-top: 1px solid var(--ligne); font-size: var(--t-petit); vertical-align: top; }
.appareil .appareil-specs td:first-child { color: var(--texte-doux); }
.appareil .appareil-specs td:last-child { text-align: right; font-weight: 500; }

.usages { display: grid; grid-template-columns: 48% 1fr; padding: 110px var(--marge); }
.usages .titre-bloc { max-width: 520px; }
.usages .tableau table { width: 100%; border-collapse: collapse; font-size: var(--t-corps); }
.usages .tableau thead { border: 0; }
.usages .tableau :is(th, td) { border: 0; border-bottom: 1px solid var(--ligne); text-align: left; }
.usages .tableau th { padding: 0 16px 14px 0; font-size: var(--t-petit); font-weight: 500; color: var(--texte-doux); }
.usages .tableau td { padding: 22px 16px 22px 0; vertical-align: top; line-height: 1.5; }
.usages .tableau td:first-child { font-size: 18px; font-weight: 500; width: 34%; }
.usages .tableau td:nth-child(2) { font-weight: 600; width: 30%; }
.usages .tableau td:last-child { color: var(--texte-doux); }

/* ── Page contact et formulaire (Contact Form 7) ────────────────── */
.contact-page { display: grid; grid-template-columns: 48% 1fr; align-items: start; padding: 104px var(--marge) 110px; }
.contact-infos { padding-right: 64px; }
.contact-infos .titre-bloc { max-width: 560px; }
.coord-liste { margin-top: 56px; display: grid; gap: 30px; }
.coord-label { font-size: var(--t-petit); color: var(--texte-doux); }
.coord-valeur { margin-top: 4px; font-size: 24px; font-weight: 500; line-height: 1.35; }

.formulaire { padding: var(--marge); border-radius: var(--rayon); background: var(--surface); }
.formulaire h2 { font-size: 28px; font-weight: 400; line-height: 1.3; }
.formulaire > p { margin-top: 8px; font-size: var(--t-petit); color: var(--texte-doux); }
.formulaire .wpcf7 { margin-top: 36px; }
.formulaire .champs { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.formulaire .champ.large { grid-column: 1 / -1; }
.formulaire .champ label { display: block; margin-bottom: 8px; font-size: var(--t-petit); color: var(--texte-doux); }
.formulaire .wpcf7-form-control-wrap { display: block; }
.formulaire .champ :is(input, select, textarea) {
  display: block; width: 100%; height: 52px; padding: 0 18px;
  border-radius: var(--rayon-s); border: 1px solid var(--ligne);
  background: var(--fond); color: var(--texte);
  font: inherit; font-size: var(--t-corps);
  outline: none; transition: border-color .2s;
}
.formulaire .champ textarea { height: 150px; padding: 14px 18px; resize: vertical; }
.formulaire .champ select {
  appearance: none; -webkit-appearance: none; cursor: pointer;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%23A8ADB3' stroke-width='1.6'%3E%3Cpath d='m4 6 4 4 4-4'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: right 18px center; background-size: 14px;
}
.formulaire .champ :is(input, select, textarea):focus { border-color: var(--accent); }
.formulaire .champ ::placeholder { color: var(--texte-inactif); }
.formulaire .consentement { margin-top: 24px; font-size: var(--t-petit); line-height: 1.6; color: var(--texte-doux); }
.formulaire .consentement .wpcf7-list-item { margin: 0; }
.formulaire .consentement label { display: flex; gap: 12px; align-items: flex-start; cursor: pointer; }
.formulaire .consentement input { margin-top: 3px; width: 16px; height: 16px; accent-color: var(--accent); flex: none; }
.formulaire .envoyer { position: relative; display: inline-flex; margin-top: 28px; margin-right: 58px; }
.formulaire .envoyer::after {
  content: ''; position: absolute; top: 0; right: -58px; width: 52px; height: 52px; border-radius: 50%;
  background: var(--accent) var(--fleche) center / 16px no-repeat; pointer-events: none; transition: transform .25s;
}
.formulaire .envoyer:hover::after { transform: rotate(45deg); }
.formulaire .wpcf7-submit {
  height: 52px; padding: 0 30px; border: 0; border-radius: 999px; cursor: pointer;
  background: var(--accent); color: var(--encre);
  font: inherit; font-size: 14px; font-weight: 600; letter-spacing: .01em; text-transform: uppercase;
}
.formulaire .wpcf7-spinner { position: absolute; right: -110px; top: 14px; margin: 0; }
.formulaire .wpcf7-not-valid-tip { margin-top: 6px; font-size: 12px; color: var(--accent); }
.formulaire .wpcf7 form .wpcf7-response-output { margin: 20px 0 0; padding: 14px 18px; border: 1px solid var(--accent); border-radius: var(--rayon-s); color: var(--texte); font-size: var(--t-corps); }

/* ── Bloc contact et pied de page ───────────────────────────────── */
.panneau { position: relative; margin: 0 var(--marge); padding: var(--marge); border-radius: var(--rayon); background: var(--surface); overflow: hidden; }
.panneau.contact { margin-bottom: var(--marge); padding-bottom: 36px; }
.etiquette-sur { font-size: 14px; line-height: 1.55; color: var(--texte-doux); }
.etiquette { font-size: 14px; line-height: 1.55; }
.contact-corps {
  display: grid; grid-template-columns: 1fr auto; align-items: end;
  margin-top: 40px; padding-bottom: 72px;
  border-bottom: 1px solid var(--ligne);
}
/* titre, bouton et fin de phrase s'enchaînent sur la même ligne */
.contact-titre { font-size: var(--t-contact); line-height: 1.4; letter-spacing: -.015em; color: var(--texte-doux); }
.contact-titre > * { display: inline; }
.contact-titre .contact-titre-texte { font-size: inherit; font-weight: 300; line-height: inherit; letter-spacing: inherit; color: inherit; }
.contact-titre .wp-block-buttons { display: inline-flex; vertical-align: middle; margin: 0 14px; transform: translateY(-6px); }
.contact-titre .wp-block-button__link { font-size: 13px; letter-spacing: .02em; }
.contact-titre-fin { font-weight: 300; }
.coordonnees { text-align: right; font-size: var(--t-petit); line-height: 1.75; }
.coordonnees strong { font-family: var(--police-titre); font-size: 18px; font-weight: 600; letter-spacing: -.01em; }   /* nom de l'entreprise */
.coordonnees a { color: var(--accent); }
.coordonnees a:hover { text-decoration: underline; }

/* Pied de page « bandeau jaune » (1.0.39) : appel au devis sur fond jaune à gauche, bord rayé de chantier ;
   logo, coordonnées, liens et mention sur fond béton à droite. Même pied sur toutes les pages. */
.pied {
  --fond: var(--anthracite); --surface: var(--beton); --texte: var(--blanc-casse); --texte-doux: var(--gris-clair);
  --ligne: rgba(242, 240, 235, .14); --contour: rgba(242, 240, 235, .7); --lien-souligne: transparent;
  --ico-tel: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2'%3E%3Cpath d='M22 16.9v3a2 2 0 0 1-2.2 2 19.8 19.8 0 0 1-8.6-3.1 19.5 19.5 0 0 1-6-6A19.8 19.8 0 0 1 2.1 4.2 2 2 0 0 1 4.1 2h3a2 2 0 0 1 2 1.7c.1 1 .4 1.9.7 2.8a2 2 0 0 1-.5 2.1L8 9.9a16 16 0 0 0 6 6l1.3-1.3a2 2 0 0 1 2.1-.4c.9.3 1.8.6 2.8.7a2 2 0 0 1 1.7 2z'/%3E%3C/svg%3E");
  --ico-mail: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2'%3E%3Crect x='2' y='4' width='20' height='16' rx='2'/%3E%3Cpath d='m22 7-10 6L2 7'/%3E%3C/svg%3E");
  display: grid; grid-template-columns: minmax(300px, .9fr) 2fr;
  margin: 0; border-radius: 0; overflow: hidden;
  background: var(--surface); color: var(--texte); font-size: var(--t-petit);
}
/* pied en pleine largeur : le contenu s'aligne sur les marges de la page */
@media (min-width: 961px) { .pied .pied-appel { padding-left: var(--marge); } .pied .pied-infos { padding-right: var(--marge); } }
.pied a:hover { color: var(--accent); }
/* les groupes sont en disposition « flow » : WordPress ajoute une marge haute entre enfants */
.pied > *, .pied :is(.pied-appel, .pied-appel-haut, .pied-appel-bas, .pied-infos, .pied-haut) > * { margin-block: 0; }

.pied-appel {
  position: relative; display: flex; flex-direction: column; justify-content: space-between; gap: 22px;
  padding: 30px 56px 30px 32px; background: var(--accent); color: var(--encre);
}
.pied-appel::after {   /* bord rayé jaune/anthracite */
  content: ''; position: absolute; top: 0; right: 0; bottom: 0; width: 22px;
  background: repeating-linear-gradient(-45deg, var(--anthracite) 0 9px, transparent 9px 18px);
}
.pied-repere { display: flex; align-items: center; gap: 9px; font-size: 11px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: rgba(28, 31, 35, .72); }
.pied-repere::before { content: ''; width: 8px; height: 8px; flex-shrink: 0; background: var(--anthracite); }
.pied .pied-appel-titre { margin-top: 8px; font-family: var(--police-titre); font-size: 30px; font-weight: 600; line-height: 1.1; letter-spacing: -.02em; color: var(--encre); }
.pied-appel-bas { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 22px; }
.pied-appel .wp-block-buttons > .wp-block-button { padding-right: 52px; }
.pied-appel .wp-block-button__link { height: 46px; padding: 0 24px; font-size: 13px; }
.pied-appel .wp-block-button__link::after { width: 46px; height: 46px; right: -53px; background-size: 15px; }
.pied-appel .wp-block-button.b-sombre .wp-block-button__link { color: var(--blanc-casse); }
.pied .pied-tel a { display: inline-flex; align-items: center; gap: 8px; font-size: 14px; font-weight: 700; color: var(--encre); }
.pied .pied-tel a:hover { color: var(--encre); text-decoration: underline; }
.pied-tel a::before, .pied-mail::before {
  content: ''; width: 15px; height: 15px; flex-shrink: 0; background: currentColor;
  -webkit-mask: var(--ico-tel) center / contain no-repeat; mask: var(--ico-tel) center / contain no-repeat;
}

.pied-infos { display: flex; flex-direction: column; gap: 22px; padding: 30px 36px 20px; }
.pied-haut { display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: space-between; gap: 18px 30px; }
.pied .logo-pied img { width: 150px; height: auto; }
.pied-coord { text-align: right; line-height: 1.7; color: var(--texte-doux); }
.pied-coord .pied-mail { display: inline-flex; align-items: center; gap: 8px; color: var(--texte); }
.pied-mail::before { background: var(--accent); -webkit-mask-image: var(--ico-mail); mask-image: var(--ico-mail); }
.pied .pied-menu .wp-block-navigation__container { display: grid; grid-template-columns: repeat(4, auto); justify-content: start; gap: 6px 30px; }
.pied .pied-menu .wp-block-navigation-item__content { font-size: var(--t-petit); color: var(--texte); }
.pied .pied-menu .wp-block-navigation-item__content:hover { color: var(--accent); }
.pied-mention {
  display: flex; flex-wrap: wrap; justify-content: space-between; align-items: baseline; gap: 6px 24px;
  margin-top: auto; padding-top: 14px; border-top: 1px solid var(--ligne); font-size: 12px; color: var(--texte-doux);
}
.pied-legal { display: flex; flex-wrap: wrap; gap: 4px 18px; white-space: nowrap; }
.pied-legal a { color: var(--texte); }

/* une dernière section sans marge basse, juste avant le bloc contact */
.wp-block-post-content > :is(.services, .section-atouts, .realisations-bento, .zone-home, .drones, .tarifs, .video-chantier):last-child { padding-bottom: 110px; }

/* ── Vidéo d'exemple (accueil) ──────────────────────────────────── */
.video-chantier { padding: 110px var(--marge) 0; }
.video-chantier .video-cadre { margin-top: 48px; border-radius: var(--rayon); overflow: hidden; background: var(--anthracite); }
.video-chantier .video-cadre video { display: block; width: 100%; aspect-ratio: 16 / 9; object-fit: cover; background: var(--anthracite); }
.video-chantier .video-cadre figcaption { margin: 0; padding: 14px 22px; text-align: left; font-size: var(--t-petit); color: var(--gris-clair); }

/* ── Coordonnées : conseils pour un devis rapide ─────────────────── */
.contact-infos > p:not(.repere) { margin-top: 40px; max-width: 480px; font-size: var(--t-corps); line-height: 1.7; color: var(--texte-doux); }
.contact-infos > p:not(.repere) strong { font-weight: 600; }

/* ── Guide : article long avec sommaire collant ──────────────────── */
.guide { display: grid; grid-template-columns: 290px minmax(0, 780px); column-gap: 80px; padding: 104px var(--marge) 110px; }
.guide-sommaire { position: sticky; top: 32px; align-self: start; }
.guide-sommaire ol.wp-block-list { margin-top: 20px; padding: 0; list-style: none; counter-reset: sommaire; }
.guide-sommaire li { counter-increment: sommaire; border-bottom: 1px solid var(--ligne); }
.guide-sommaire li a { display: flex; gap: 12px; padding: 11px 0; font-size: 14px; line-height: 1.4; color: var(--texte-doux); transition: color .2s; }
.guide-sommaire li a::before { content: counter(sommaire, decimal-leading-zero); flex: none; font-size: 11px; font-weight: 700; line-height: 20px; color: var(--texte-inactif); }
.guide-sommaire li a:hover { color: var(--texte); }
.guide-texte > h2 { margin-top: 76px; scroll-margin-top: 28px; font-family: var(--police-titre); font-size: 34px; font-weight: 600; line-height: 1.12; letter-spacing: -.02em; }
.guide-texte > h3 { margin-top: 34px; scroll-margin-top: 28px; font-size: 20px; font-weight: 600; line-height: 1.3; }
.guide-texte > p, .guide-texte li { font-size: 16px; line-height: 1.75; color: var(--texte-doux); }
.guide-texte > p { margin-top: 16px; }
.guide-texte > p:first-child { font-size: 19px; line-height: 1.6; color: var(--texte); }
.guide-texte ul.wp-block-list, .guide-texte ol.wp-block-list { margin-top: 14px; padding-left: 22px; list-style: disc; }
.guide-texte ol.wp-block-list { list-style: decimal; }
.guide-texte li + li { margin-top: 6px; }
.guide-texte li::marker { color: var(--accent); }
.guide-texte strong { font-weight: 600; }
.guide-texte a:not(.wp-block-button__link) { color: var(--texte); text-decoration: underline; text-decoration-color: var(--accent); text-decoration-thickness: 2px; text-underline-offset: 3px; }
.guide-texte > .wp-block-image { margin-top: 32px; }
.guide-texte > .wp-block-image img { width: 100%; border-radius: var(--rayon-s); }
.guide-texte > .wp-block-image figcaption { margin-top: 10px; text-align: left; font-size: var(--t-petit); color: var(--texte-doux); }
.guide-texte > .encadre { margin-top: 28px; padding: 22px 26px; border-left: 4px solid var(--accent); border-radius: 0 var(--rayon-s) var(--rayon-s) 0; background: var(--surface); }
.guide-texte > .encadre p { font-size: 15px; line-height: 1.7; color: var(--texte-doux); }
.guide-texte > .encadre p + p { margin-top: 8px; }
.guide-texte > .encadre .encadre-titre { font-size: 12px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--texte); }
.guide-texte > .wp-block-table { margin-top: 24px; overflow-x: auto; }
.guide-texte > .wp-block-table table { width: 100%; min-width: 560px; border-collapse: collapse; font-size: 14px; }
.guide-texte > .wp-block-table :is(th, td) { padding: 12px 14px 12px 0; border: 0; border-bottom: 1px solid var(--ligne); text-align: left; vertical-align: top; line-height: 1.5; }
.guide-texte > .wp-block-table thead { border: 0; }
.guide-texte > .wp-block-table th { font-size: 12px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--texte); }
.guide-texte > .wp-block-table td { color: var(--texte-doux); }
.guide-texte > .wp-block-table td:first-child { font-weight: 600; color: var(--texte); }
.guide-texte > .wp-block-buttons { margin-top: 32px; }

/* ── Pages simples (mentions légales…) ──────────────────────────── */
.texte-legal { max-width: 860px; padding: 104px var(--marge) 110px; }
.texte-legal h2 { margin-top: 40px; font-family: var(--police-titre); font-size: 26px; font-weight: 600; }
.texte-legal p, .texte-legal li { margin-top: 12px; font-size: var(--t-corps); line-height: 1.75; color: var(--texte-doux); }
.texte-legal a { text-decoration: underline; text-decoration-color: var(--lien-souligne); text-underline-offset: 3px; }
.texte-legal ul.wp-block-list { padding-left: 22px; list-style: disc; }
.texte-legal h2:first-child { margin-top: 0; }

/* ── Page Tarifs ────────────────────────────────────────────────── */
/* Prix lus dans le calculateur : codes courts [tarif formule=…], [tarif_duree], [tarif_grille], [tarif_zones] (inc/formules.php). */
.formules, .degressif, .options-tarifs { padding: 110px var(--marge) 0; }

/* choix de la durée : une barre anthracite, un bouton par palier */
.ct-durees {
  display: flex; flex-wrap: wrap; align-items: center; gap: 14px 24px;
  margin-top: 48px; padding: 10px 10px 10px 28px;
  border-radius: 999px; background: var(--anthracite); color: var(--blanc-casse);
}
.ct-durees-titre { display: flex; align-items: center; gap: 10px; font-size: 12px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; }
.ct-durees-titre::before { content: ''; flex: none; width: 10px; height: 10px; background: var(--accent); }
.ct-durees-liste { display: flex; flex-wrap: wrap; gap: 6px; margin-left: auto; }
.ct-duree-choix { position: relative; cursor: pointer; }
.ct-duree-choix input { position: absolute; inset: 0; z-index: 1; width: 100%; height: 100%; margin: 0; opacity: 0; cursor: pointer; }
.ct-duree-choix span {
  display: inline-flex; align-items: center; height: 44px; padding: 0 20px;
  border: 1px solid rgba(242, 240, 235, .22); border-radius: 999px;
  font-size: 14px; font-weight: 600; white-space: nowrap;
  transition: background-color .2s, border-color .2s, color .2s;
}
.ct-duree-choix:hover span { border-color: var(--accent); color: var(--accent); }
.ct-duree-choix input:checked + span { background: var(--accent); border-color: var(--accent); color: var(--encre); }
.ct-duree-choix input:focus-visible + span { outline: 3px solid var(--accent); outline-offset: 3px; }

/* cartes des formules, toutes coiffées d'un ruban de chantier sur Tarifs (2026-10-13) ; .formule-phare (film Premium) est sombre */
.formules-grille { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; margin-top: 24px; }
.formule {
  position: relative; overflow: hidden;
  display: flex; flex-direction: column;
  padding: 44px 36px 36px;
  border: 1px solid var(--ligne); border-radius: var(--rayon);
  background: var(--surface);
}
.formule-phare {
  border-color: transparent;
  background-color: var(--anthracite);
  background-image:
    linear-gradient(rgba(242, 240, 235, .05) 1px, transparent 1px),
    linear-gradient(90deg, rgba(242, 240, 235, .05) 1px, transparent 1px);
  background-size: 48px 48px;
  box-shadow: 0 24px 50px rgba(28, 31, 35, .22);
}
.formule-phare::before, .formules-grille:not(.duo) > .formule::before { content: ''; position: absolute; top: 0; left: 0; right: 0; height: 8px; background: repeating-linear-gradient(-45deg, var(--encre) 0 12px, var(--accent) 12px 24px); }
.formule .formule-badge { position: absolute; top: 32px; right: 32px; padding: 6px 12px; background: var(--accent); color: var(--encre); font-size: 11px; font-weight: 700; line-height: 1.3; letter-spacing: .12em; text-transform: uppercase; }
.formule .formule-nom { font-family: var(--police-titre); font-size: 34px; font-weight: 600; line-height: 1.1; letter-spacing: -.02em; }
.formule-accroche { margin-top: 6px; font-size: 14px; color: var(--texte-doux); }
.formule-prix { margin-top: 30px; font-family: var(--police-titre); font-size: 64px; font-weight: 600; line-height: 1; letter-spacing: -.035em; font-variant-numeric: tabular-nums; }
.formule-unite { margin-top: 10px; font-size: 13px; color: var(--texte-doux); }
.formule-desc { margin-top: 24px; padding-top: 24px; border-top: 1px solid var(--ligne); font-size: 14px; line-height: 1.65; color: var(--texte-doux); }
.formule-inclut { margin-top: 22px; font-size: 12px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }
.formule-liste { display: grid; gap: 10px; margin-top: 14px; }
.formule-liste li, .formules-inclus li { position: relative; padding-left: 32px; font-size: 14px; line-height: 1.5; }
.formule-liste li::before, .formules-inclus li::before { content: ''; position: absolute; left: 0; top: 0; width: 21px; height: 21px; background: var(--accent) var(--coche) center / 13px no-repeat; }
.formule > .wp-block-buttons { margin-top: auto; padding-top: 32px; }
/* pages Film (Classique / Premium) : deux cartes côte à côte */
.formules-grille.duo { grid-template-columns: repeat(2, minmax(0, 1fr)); max-width: 1040px; }
@media (max-width: 960px) { .formules-grille.duo { grid-template-columns: 1fr; max-width: 560px; } }
/* page Tarifs, 4 formules (Essentiel basique ajoutée par le client) : toutes sur une ligne dès 1 280 px,
   en 2 × 2 en dessous ; cartes resserrées, et badge « Recommandée » accroché sous le ruban pour libérer le nom */
@media (min-width: 1280px) {
  .formules-grille:not(.duo) { grid-template-columns: none; grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr); gap: 20px; }
  .formules-grille:not(.duo) > .formule { padding: 46px 24px 28px; }
  .formules-grille:not(.duo) .formule .formule-nom { font-size: clamp(24px, 1.9vw, 30px); }
  .formules-grille:not(.duo) .formule-prix { margin-top: 26px; font-size: clamp(48px, 3.9vw, 60px); }
  .formules-grille:not(.duo) .formule-desc { margin-top: 22px; padding-top: 22px; }
  .formules-grille:not(.duo) .formule .formule-badge { top: 8px; right: 0; padding: 6px 14px; border-radius: 0 0 0 var(--rayon-s); }
  .formules-grille:not(.duo) .formule-phare .formule-nom { padding-right: 0; }
  /* boutons au format « petit » (46 px) : « Choisir Essentiel basique » tient sur deux lignes au plus */
  .elementor .formules-grille:not(.duo) .formule .elementor-widget-button.ct-bouton { padding-right: 52px; }
  .elementor .formules-grille:not(.duo) .formule .ct-bouton .elementor-button { min-height: 46px; padding: 8px 16px; font-size: 12px; }
  .elementor .formules-grille:not(.duo) .formule .ct-bouton .elementor-button::after { width: 46px; height: 46px; right: -53px; margin-top: -23px; }
}
@media (min-width: 961px) and (max-width: 1279px) {
  .formules-grille:not(.duo) { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* ce que toutes les formules comprennent */
.formules-inclus { display: grid; grid-template-columns: 300px minmax(0, 1fr); column-gap: 48px; row-gap: 22px; margin-top: 24px; padding: 32px 36px; border-radius: var(--rayon); background: var(--surface); }
.formules-inclus h3 { font-family: var(--police-titre); font-size: 24px; font-weight: 600; line-height: 1.15; letter-spacing: -.01em; }
.formules-inclus h3 + p { margin-top: 10px; font-size: var(--t-petit); line-height: 1.6; color: var(--texte-doux); }
.formules-inclus ul.wp-block-list { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px 28px; align-content: center; }

/* tarif dégressif : tableau et exemple chiffré */
.degressif-corps { display: grid; grid-template-columns: minmax(0, 1fr) 400px; column-gap: 48px; align-items: start; margin-top: 48px; }
.ct-grille { overflow-x: auto; }
.ct-grille table { width: 100%; border-collapse: separate; border-spacing: 0; font-variant-numeric: tabular-nums; }
.ct-grille caption { caption-side: bottom; padding-top: 16px; text-align: left; font-size: var(--t-petit); color: var(--texte-doux); }
.ct-grille :is(th, td) { padding: 20px 18px; border-bottom: 1px solid var(--ligne); text-align: right; white-space: nowrap; }
.ct-grille :is(th, td):first-child { padding-left: 22px; text-align: left; }
.ct-grille thead th { padding-top: 0; padding-bottom: 16px; font-size: 12px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--texte-doux); }
.ct-grille thead th.ct-phare { color: var(--texte); }
.ct-grille tbody th { font-size: 16px; font-weight: 500; }
.ct-grille tbody td { font-family: var(--police-titre); font-size: 26px; font-weight: 600; letter-spacing: -.015em; }
.ct-grille tbody td.ct-phare { background: rgba(245, 166, 35, .1); }
.ct-grille tbody tr { transition: background-color .25s; }
.ct-grille tbody tr.actif :is(th, td) { background: var(--anthracite); color: var(--blanc-casse); border-bottom-color: transparent; }
.ct-grille tbody tr.actif th { position: relative; border-radius: var(--rayon-s) 0 0 var(--rayon-s); }
.ct-grille tbody tr.actif th::before { content: ''; position: absolute; left: 0; top: 14px; bottom: 14px; width: 4px; background: var(--accent); }
.ct-grille tbody tr.actif td:last-child { border-radius: 0 var(--rayon-s) var(--rayon-s) 0; }
.ct-grille tbody tr.actif td.ct-phare { color: var(--accent); }
/* formule sans prix (CT_FORMULES « sur_demande ») : même hauteur que les prix voisins, texte plus petit */
.formule-prix .ct-sur-demande { display: block; font-size: .5em; line-height: 2; letter-spacing: -.02em; }
.ct-grille tbody td.ct-sur-demande { font-family: var(--police); font-size: 14px; font-weight: 600; letter-spacing: 0; color: var(--texte-doux); }
.ct-grille tbody tr.actif td.ct-sur-demande { color: var(--gris-clair); }
.ct-grille thead th { white-space: normal; }   /* noms de formule en deux mots : retour à la ligne permis */
/* noms de formule en deux mots : le badge « Recommandée » garde sa place à droite du nom,
   et le bouton de la carte passe sur deux lignes plutôt que de déborder quand la carte est étroite */
.formule-phare .formule-nom { padding-right: 136px; }
.elementor .formule .elementor-widget-button.ct-bouton { width: 100%; max-width: none; }
.elementor .formule .ct-bouton .elementor-button { width: 100%; height: auto; min-height: 52px; padding: 10px 22px; white-space: normal; text-align: center; line-height: 1.25; }
.elementor .formule .ct-bouton .elementor-button::after { top: 50%; margin-top: -26px; }

.exemple-budget {
  padding: 32px;
  border-radius: var(--rayon);
  background-color: var(--anthracite);
  background-image:
    linear-gradient(rgba(242, 240, 235, .05) 1px, transparent 1px),
    linear-gradient(90deg, rgba(242, 240, 235, .05) 1px, transparent 1px);
  background-size: 48px 48px;
}
.exemple-haut { display: flex; align-items: center; gap: 10px; font-size: 12px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; }
.exemple-haut::before { content: ''; flex: none; width: 10px; height: 10px; background: var(--accent); }
.exemple-budget h3 { margin-top: 16px; font-family: var(--police-titre); font-size: 24px; font-weight: 600; line-height: 1.2; letter-spacing: -.01em; }
.exemple-budget .exemple-table { margin-top: 22px; }
.exemple-budget .exemple-table table { width: 100%; border-collapse: collapse; font-variant-numeric: tabular-nums; }
.exemple-budget .exemple-table :is(td, th) { padding: 12px 0; border: 0; border-bottom: 1px solid var(--ligne); font-size: 14px; line-height: 1.4; vertical-align: top; }
.exemple-budget .exemple-table td:first-child { padding-right: 16px; color: var(--texte-doux); }
.exemple-budget .exemple-table td:last-child { text-align: right; white-space: nowrap; font-weight: 600; }
.exemple-budget .exemple-table tfoot { border: 0; }
.exemple-budget .exemple-table tfoot td { padding-top: 18px; border-bottom: 0; font-size: 15px; font-weight: 700; color: var(--texte); }
.exemple-budget .exemple-table tfoot td:last-child { font-family: var(--police-titre); font-size: 34px; line-height: 1; letter-spacing: -.02em; color: var(--accent); }
.exemple-budget .exemple-note { margin-top: 14px; font-size: 12px; line-height: 1.6; color: var(--texte-doux); }

/* options à la carte */
.options-grille { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 24px; margin-top: 48px; }
.option-carte { display: flex; flex-direction: column; padding: 30px 28px; border-radius: var(--rayon); background: var(--surface); }
.option-carte .option-type { align-self: flex-start; padding: 5px 12px; border: 1px solid var(--contour); border-radius: 999px; font-size: 11px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }
.option-carte h3 { margin-top: 20px; font-size: 20px; font-weight: 600; line-height: 1.3; }
.option-prix { margin-top: 18px; font-family: var(--police-titre); font-size: 44px; font-weight: 600; line-height: 1; letter-spacing: -.03em; font-variant-numeric: tabular-nums; }
.option-unite { margin-top: 8px; font-size: 13px; color: var(--texte-doux); }
.option-desc { margin-top: 20px; padding-top: 20px; border-top: 1px solid var(--ligne); font-size: 14px; line-height: 1.6; color: var(--texte-doux); }
.option-desc a { color: var(--texte); text-decoration: underline; text-decoration-color: var(--lien-souligne); text-decoration-thickness: 2px; text-underline-offset: 3px; }

/* déplacement : une ligne par zone, barre proportionnelle à la distance */
.deplacement { display: grid; grid-template-columns: minmax(0, 1fr) 52%; column-gap: 64px; align-items: start; padding: 110px var(--marge) 0; }
.deplacement-texte > p:not(.repere) { margin-top: 20px; max-width: 520px; font-size: var(--t-corps); line-height: 1.7; color: var(--texte-doux); }
.deplacement-texte .wp-block-buttons { margin-top: 28px; }
.ct-zones { margin: 0; padding: 0; list-style: none; border-top: 1px solid var(--ligne); }
.ct-zone { position: relative; display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 20px 0 34px; border-bottom: 1px solid var(--ligne); }
.ct-zone::before, .ct-zone::after { content: ''; position: absolute; left: 0; bottom: 14px; height: 6px; border-radius: 3px; }
.ct-zone::before { right: 0; background: var(--ligne); }
.ct-zone::after { width: calc(var(--ct-part, 1) * 100%); background: var(--anthracite); }
.ct-zone-inclus::after { background: var(--accent); }
.ct-zone-devis::after { background: repeating-linear-gradient(-45deg, var(--anthracite) 0 6px, transparent 6px 12px); }
.ct-zone-nom { display: block; font-size: 20px; font-weight: 600; line-height: 1.3; }
.ct-zone-detail { display: block; margin-top: 2px; font-size: var(--t-petit); color: var(--texte-doux); }
.ct-zone-prix { flex: none; font-family: var(--police-titre); font-size: 22px; font-weight: 600; white-space: nowrap; }
.ct-zone-inclus .ct-zone-prix { padding: 6px 14px; background: var(--accent); color: var(--encre); font-family: var(--police); font-size: 12px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; }
.ct-zones-note { margin-top: 16px; font-size: var(--t-petit); color: var(--texte-doux); }

/* ── Animations sobres ──────────────────────────────────────────── */
@view-transition { navigation: auto; }
::view-transition-old(root), ::view-transition-new(root) { animation-duration: .45s; }

@media (prefers-reduced-motion: no-preference) {
  .js-anim .hero .hero-photo { top: -80px; height: calc(100% + 80px); animation: poser 2.2s cubic-bezier(.2, .6, .2, 1) both; }
  .js-anim .zone-entete { animation: monter .9s .1s cubic-bezier(.2, .6, .2, 1) both; }
  .js-anim .hero .fil { animation: monter .9s .2s cubic-bezier(.2, .6, .2, 1) both; }
  .js-anim .hero .hero-titre { animation: monter 1.1s .3s cubic-bezier(.2, .6, .2, 1) both; }
  .js-anim .hero .hero-accroche { animation: monter 1s .45s cubic-bezier(.2, .6, .2, 1) both; }
  .js-anim .hero .hero-tags { animation: monter .9s .55s cubic-bezier(.2, .6, .2, 1) both; }
  .js-anim .hero :is(.hero-defile, .hero-encart) { animation: monter .9s .7s cubic-bezier(.2, .6, .2, 1) both; }

  .js-anim .revele {
    opacity: 0; transform: translateY(32px);
    transition: opacity .9s cubic-bezier(.2, .6, .2, 1), transform .9s cubic-bezier(.2, .6, .2, 1);
    transition-delay: var(--delai, 0s);
  }
  .js-anim .revele.visible { opacity: 1; transform: none; }
  .js-anim .atout.revele .wp-block-image img { clip-path: inset(7% 7% 7% 7% round var(--rayon-s)); transition: clip-path 1.3s cubic-bezier(.2, .6, .2, 1) var(--delai, 0s); }
  .js-anim .atout.revele.visible .wp-block-image img { clip-path: inset(0 round var(--rayon-s)); }
  .js-anim .frise.revele { opacity: 1; transform: none; }
  .js-anim .frise.revele:not(.visible)::after { transform: scaleX(0); }
}
@media print { .js-anim .revele { opacity: 1 !important; transform: none !important; } }
@media (prefers-reduced-motion: reduce) { .ruban .ruban-piste { animation: none; } }
@keyframes poser { from { transform: scale(1.12); } to { transform: scale(1); } }
@keyframes monter { from { opacity: 0; transform: translateY(30px); } to { opacity: 1; transform: none; } }

/* ── Responsive ─────────────────────────────────────────────────── */
@media (max-width: 1280px) {
  :root { --t-hero: 68px; --t-contact: 52px; }
  .atouts { grid-template-columns: repeat(2, 1fr); }
  .atout .wp-block-image img { height: 280px; }
  .appareils { grid-template-columns: 1fr 1fr; }
  .fiche .fiche-visuel { margin-right: 32px; }
}

@media (max-width: 960px) {
  :root { --marge: 24px; --t-hero: 52px; --t-bloc: 36px; --t-contact: 40px; }

  .entete .entete-cta { display: none; }

  .hero { height: 760px; }
  .hero::before { background: linear-gradient(180deg, rgba(28, 31, 35, .55) 0%, rgba(28, 31, 35, .42) 45%, rgba(28, 31, 35, .62) 100%); }
  .hero-texte { top: 150px; right: var(--marge); }
  .hero-accroche { font-size: 17px; margin-top: 16px; }
  .hero .hero-tags { bottom: 210px; max-width: none; right: var(--marge); }
  .hero-defile { left: var(--marge); bottom: 24px; }
  .hero-defile::after { width: calc(100% - 2 * var(--marge) - 34px); }
  .carte-verre { width: 300px; }
  .carte-verre .wp-block-image img { width: 96px; height: 96px; }
  .carte-verre h3 { font-size: 18px; }
  .hero.hero-page { height: 700px; }
  .hero.hero-court { height: 440px; }
  .hero .fil { top: 124px; }
  .hero-page .hero-texte { top: 156px; }
  .hero-page .hero-tags { display: none; }
  .hero-encart { left: var(--marge); width: auto; bottom: var(--marge); }

  .ruban { margin-top: -18px; }
  .ruban-piste li { gap: 20px; padding: 11px 0 11px 20px; font-size: 16px; }
  .intro { padding-top: 76px; }
  .intro-grille, .bloc-tete { grid-template-columns: 1fr; row-gap: 22px; }
  .chiffres { grid-template-columns: 1fr 1fr; row-gap: 32px; margin-top: 44px; }
  .chiffres > .wp-block-group:nth-child(2) { border-right: 0; }
  .chiffres > .wp-block-group:nth-child(3) { padding-left: 0; }
  .chiffre-valeur { font-size: 46px; }
  .services, .realisations-bento, .zone-home, .section-atouts, .drones, .tarifs { padding-top: 80px; }
  .tarifs > .ctc { margin-top: 32px; }
  .services-corps { grid-template-columns: 1fr; margin-top: 32px; }
  .services-visuel { display: none; }
  .services-item { grid-template-columns: 36px 1fr 40px; row-gap: 6px; min-height: 0; padding: 20px 0; }
  .services-item.actif { padding-left: 16px; }
  .services-item .services-nom { grid-column: 2; font-size: 26px; }
  .services-desc { grid-column: 2; grid-row: 2; }
  .services-liste:not(.services-texte) .services-item::after { width: 40px; height: 40px; margin-top: -20px; right: 0; }
  .services-texte .services-item { grid-template-columns: 36px 1fr; }
  .services-texte .services-item .services-nom { font-size: 22px; }
  .bento { grid-template-columns: 1fr; grid-template-rows: none; grid-auto-rows: 300px; margin-top: 32px; }
  .bento-grande, .bento-cta { grid-row: auto; grid-column: auto; }
  .bento-cta { gap: 20px; }
  .process, .plan { margin-top: 80px; padding: 76px var(--marge) 84px; }
  .frise { grid-template-columns: 1fr; row-gap: 36px; margin-top: 44px; padding: 0 0 0 44px; }
  .frise::before, .frise::after { left: 8px; right: auto; top: 0; bottom: 0; width: 2px; height: auto; transform-origin: top; }
  .js-anim .frise.revele:not(.visible)::after { transform: scaleY(0); }
  .frise-etape::before { top: 6px; left: -44px; }
  .frise-num { font-size: 44px; }
  .zone-home { grid-template-columns: 1fr; row-gap: 36px; }
  .carte-zone { grid-template-columns: 1fr; row-gap: 36px; padding-top: 80px; }
  .carte-cadre { padding: 18px 16px 16px; }
  .zone-home .zone-home-photo { min-height: 300px; }
  .faq { grid-template-columns: 1fr; gap: 40px; padding: 80px var(--marge); }
  .faq .titre-bloc { font-size: var(--t-bloc); }
  .faq-liste .faq-item summary { padding: 20px 72px 20px 16px; font-size: 17px; }
  .faq-liste .faq-item summary::after { right: 16px; }
  .faq-liste .faq-item > p { padding: 0 16px 24px; }
  .atouts { margin-top: 44px; }
  .fiche { grid-template-columns: 1fr; gap: 40px; }
  .fiche .fiche-visuel { margin-right: 0; height: 280px; }
  .appareils { grid-template-columns: 1fr; margin-top: 40px; }
  .usages { grid-template-columns: 1fr; gap: 40px; padding: 80px var(--marge); }
  .usages .tableau thead { display: none; }
  .usages .tableau :is(table, tbody, tr, td) { display: block; width: auto !important; }
  .usages .tableau tr { padding: 18px 0; border-bottom: 1px solid var(--ligne); }
  .usages .tableau td { padding: 2px 0; border: 0; }
  .contact-page { grid-template-columns: 1fr; gap: 56px; padding: 80px var(--marge) 90px; }
  .contact-infos { padding-right: 0; }

  .contact-corps { grid-template-columns: 1fr; gap: 32px; }
  .coordonnees { text-align: left; }
  .contact-titre .wp-block-buttons { margin: 0 8px; transform: translateY(-4px); }
  .contact-titre .wp-block-buttons > .wp-block-button { padding-right: 48px; }
  .contact-titre .wp-block-button__link { height: 42px; padding: 0 18px; font-size: 12px; }
  .contact-titre .wp-block-button__link::after { width: 42px; height: 42px; right: -49px; }
  .pied { grid-template-columns: 1fr; }
  .pied-coord { text-align: left; }
  .pied .pied-menu .wp-block-navigation__container { grid-template-columns: repeat(2, auto); gap: 8px 30px; }
  .wp-block-post-content > :is(.services, .section-atouts, .realisations-bento, .zone-home, .drones, .tarifs):last-child { padding-bottom: 80px; }
}

@media (max-width: 480px) {
  :root { --marge: 16px; --t-hero: 40px; --t-bloc: 30px; --t-contact: 34px; }
  .entete .logo img { width: 190px; }
  .hero { height: 740px; }
  .hero-texte { top: 130px; }
  .hero-accroche { font-size: 16px; }
  .hero .hero-tags { bottom: 236px; gap: 8px; }
  .hero-tags li { height: 36px; padding: 0 16px; font-size: 13px; }
  .carte-verre { width: 270px; }
  .hero.hero-page { height: 680px; }
  .hero.hero-court { height: 420px; }
  .hero-page .hero-texte { top: 150px; }
  .wp-block-button .wp-block-button__link { padding: 0 22px; }
  .atouts { grid-template-columns: 1fr; }
  .atout .wp-block-image img { height: 240px; }
  .formulaire .champs { grid-template-columns: 1fr; }
  .specs { grid-template-columns: 1fr; gap: 28px; }
  .formulaire { padding: 24px; }
  .coord-valeur { font-size: 20px; }
  .chiffre-valeur { font-size: 40px; }
  .services-item .services-nom { font-size: 22px; }
  .bento-cta-texte { font-size: 26px; }
  .pied-appel { padding: 26px 46px 26px 22px; }
  .pied .pied-appel-titre { font-size: 26px; }
  .pied-infos { padding: 26px 22px 18px; }
  .carte-france .numeros { display: none; }   /* illisibles à cette taille : la liste les donne */
}

/* ── Vidéo d'exemple et guide : petits écrans ───────────────────── */
@media (max-width: 1100px) {
  .guide { grid-template-columns: 230px minmax(0, 1fr); column-gap: 48px; }
}
@media (max-width: 960px) {
  .video-chantier { padding-top: 80px; }
  .video-chantier .video-cadre { margin-top: 32px; }
  .wp-block-post-content > .video-chantier:last-child { padding-bottom: 80px; }
  .guide { grid-template-columns: 1fr; row-gap: 40px; padding: 76px var(--marge) 80px; }
  .guide-sommaire { position: static; }
  .guide-texte > h2 { margin-top: 56px; font-size: 28px; }
  .guide-texte > p:first-child { font-size: 17px; }
  .contact-infos > p:not(.repere) { margin-top: 32px; }
}

/* ── Page Tarifs : écrans moyens et petits ──────────────────────── */
@media (max-width: 1280px) {
  .formule { padding: 40px 28px 30px; }
  .formule-prix { font-size: 56px; }
  .formules-inclus { grid-template-columns: 1fr; }
  .formules-inclus ul.wp-block-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .degressif-corps { grid-template-columns: 1fr; row-gap: 32px; }
  .exemple-budget { max-width: 560px; }
  .options-grille { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 960px) {
  .formules, .degressif, .options-tarifs { padding-top: 80px; }
  .ct-durees { margin-top: 32px; padding: 20px; border-radius: var(--rayon); }
  .ct-durees-liste { margin-left: 0; }
  .formules-grille { grid-template-columns: 1fr; max-width: 560px; }
  .formules-inclus { padding: 28px 24px; }
  .degressif-corps, .options-grille { margin-top: 32px; }
  .ct-grille :is(th, td) { padding: 16px 10px; }
  .ct-grille :is(th, td):first-child { padding-left: 14px; }
  .ct-grille tbody th { white-space: normal; font-size: 14px; }
  .ct-grille tbody td { font-size: 20px; }
  .deplacement { grid-template-columns: 1fr; row-gap: 36px; padding-top: 80px; }
}
@media (max-width: 480px) {
  .ct-duree-choix span { height: 40px; padding: 0 14px; font-size: 13px; }
  .formule { padding: 40px 22px 26px; }
  .formule .formule-badge { top: 24px; right: 22px; }
  .formule-prix { font-size: 52px; }
  .formules-inclus ul.wp-block-list, .options-grille { grid-template-columns: 1fr; }
  /* 5 colonnes (dont « Sans abonnement ») : tout doit tenir dès 360 px, sans faire glisser le tableau */
  .ct-grille thead th { font-size: 9.5px; letter-spacing: .02em; }
  .ct-grille :is(th, td) { padding: 12px 4px; }
  .ct-grille :is(th, td):first-child { padding-left: 10px; }
  .ct-grille tbody th { font-size: 13px; }
  .ct-grille tbody td { font-size: 15px; letter-spacing: -.02em; }
  .ct-grille tbody td.ct-sur-demande { font-size: 11px; line-height: 1.25; white-space: normal; }
  .exemple-budget { padding: 26px 22px; }
  .ct-zone-nom { font-size: 17px; }
  .ct-zone-prix { font-size: 18px; }
}

/* bandeau court des pages de texte (mentions légales, CGV) : plus spécifique que .hero.hero-page */
.hero.hero-page.hero-court { height: 480px; }
@media (max-width: 960px) { .hero.hero-page.hero-court { height: 440px; } }
@media (max-width: 480px) { .hero.hero-page.hero-court { height: 420px; } }

/* page Plan du site : une carte par rubrique, liens fléchés */
.plan-du-site { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; align-items: start; padding: 104px var(--marge) 110px; }
.plan-groupe { background: var(--surface); border-radius: 16px; padding: 28px 30px 18px; }
.plan-groupe h2 { font-family: var(--police-titre); font-size: 22px; font-weight: 600; }
.plan-groupe ul.wp-block-list { margin-top: 14px; padding: 0; list-style: none; }
.plan-groupe li { border-top: 1px solid var(--ligne); }
.plan-groupe li a { display: flex; justify-content: space-between; gap: 16px; padding: 13px 0; font-size: var(--t-corps); color: var(--texte); }
.plan-groupe li a::after { content: "→"; color: var(--texte-doux); transition: transform .2s ease, color .2s ease; }
.plan-groupe li a:hover { color: var(--accent); }
.plan-groupe li a:hover::after { color: var(--accent); transform: translateX(3px); }
@media (max-width: 960px) { .plan-du-site { grid-template-columns: repeat(2, minmax(0, 1fr)); padding-top: 72px; padding-bottom: 80px; } }
@media (max-width: 480px) { .plan-du-site { grid-template-columns: minmax(0, 1fr); padding-top: 48px; padding-bottom: 64px; } .plan-groupe { padding: 24px 22px 14px; } }

/* pastilles des cartes d'options : à la taille du texte (Elementor étire les widgets sur toute la carte) */
.option-carte .option-type { width: fit-content; }
/* exemple de budget : les montants prenaient la couleur sombre du texte d'Elementor, invisible sur l'anthracite */
.exemple-budget .exemple-table td:last-child { color: var(--texte); }

/* lien vers la page de détail de chaque formule (cartes de la page Tarifs) */
.formule-detail { margin-top: 20px; font-size: 14px; font-weight: 600; }
.formule-detail a { color: var(--texte); text-decoration: underline; text-decoration-color: var(--accent); text-decoration-thickness: 2px; text-underline-offset: 4px; }
.formule-detail a::after { content: ' →'; }

/* pages de détail des formules (/tarifs/<formule>/) */
.degressif-corps + .formules-inclus { margin-top: 56px; }
.formules-inclus li a { color: var(--texte); text-decoration: underline; text-decoration-color: var(--accent); text-decoration-thickness: 2px; text-underline-offset: 3px; }
.exemple-budget .formule-liste { margin-top: 22px; }
.exemple-budget .wp-block-buttons { margin-top: 26px; }