/*
Theme Name: 3D phi (v2)
Theme URI: https://3dphi.com/
Author: 3D phi
Description: Thème blocs natif du site 3D phi, reproduction à l'identique du site d'origine sans constructeur de pages. En-tête, modèles et styles modifiables dans Apparence > Éditeur.
Version: 2.0.0
Requires at least: 7.0
Requires PHP: 8.1
Text Domain: 3dphi-v2
*/

img { height: auto; max-width: 100%; }

/* ==========================================================================
   En-tête (identique à l'original : barre bleu nuit, logo, menu, réseaux, drapeaux)
   ========================================================================== */
/* L'en-tête reste visible en haut de l'écran (comme le menu fixe d'origine).
   « sticky » s'applique au conteneur de la partie de modèle, sinon il ne colle pas. */
.wp-block-template-part:has(> .site-header) {
	position: sticky;
	top: 0;
	z-index: 1000;
}
body.admin-bar .wp-block-template-part:has(> .site-header) { top: var(--wp-admin--admin-bar--height, 32px); }
@media (max-width: 600px) {
	body.admin-bar .wp-block-template-part:has(> .site-header) { top: 0; }
}
.site-header {
	background: #131731;
	color: rgba(255, 255, 255, .8);
}

.site-header__inner {
	max-width: 1140px;
	margin-inline: auto;
	padding: 21px 12px;
	gap: 0 15px;
}

.site-header .wp-block-site-logo img { width: 240px; height: 60px; object-fit: contain; }

.site-header .wp-block-navigation a {
	color: rgba(255, 255, 255, .8);
	text-decoration: none;
	padding: 8px;
}
.site-header .wp-block-navigation a:hover,
.site-header .wp-block-navigation a:focus-visible { color: #fff; }
.site-header .wp-block-navigation__responsive-container.is-menu-open {
	background: #131731 !important;
	padding: 2rem;
}

/* Icônes réseaux sociaux : carré or 24 px, glyphe blanc ; inversé au survol */
.site-header .wp-block-social-links .wp-social-link {
	background: #DDA35F !important;
	color: #fff !important;
	border-radius: 5px;
	margin: 8px !important;
	transition: background .25s ease, color .25s ease;
}
.site-header .wp-block-social-links .wp-social-link a { padding: 4px; }
.site-header .wp-block-social-links .wp-social-link svg { width: 16px; height: 16px; }
.site-header .wp-block-social-links .wp-social-link:hover,
.site-header .wp-block-social-links .wp-social-link:focus-within {
	background: #fff !important;
	color: #131731 !important;
	transform: none;
}
.site-header .drapeaux img { display: block; width: 48px; height: 32px; margin: 8px; }

/* ==========================================================================
   Pages : texte Roboto gris, comme les blocs texte d'origine
   ========================================================================== */
body.page .wp-block-post-content p,
body.page .wp-block-post-content .wp-block-list:not(.is-style-puces-cube) li {
	font-family: var(--wp--preset--font-family--roboto);
	color: var(--wp--preset--color--gris-texte);
}

/* Titres : styles « 3D phi » proposés dans l'éditeur */
.wp-block-heading.is-style-titre-3dphi {
	font-family: var(--wp--preset--font-family--agenda);
	font-weight: 700;
	line-height: 1;
	color: var(--wp--preset--color--bleu-nuit);
}
.wp-block-heading.is-style-sous-titre-or {
	font-family: var(--wp--preset--font-family--monsal-gothic);
	font-size: 20px;
	font-weight: 400;
	line-height: 1;
	color: var(--wp--preset--color--or);
}
.wp-block-heading.is-style-titre-leger {
	font-family: var(--wp--preset--font-family--roboto);
	font-size: 20px;
	font-weight: 300;
	line-height: 1;
	text-transform: uppercase;
	color: var(--wp--preset--color--noir);
}

/* Liste à puces « cube 3D » (icône or, texte Roboto) */
.wp-block-list.is-style-puces-cube { list-style: none; padding-left: 0; }
.wp-block-list.is-style-puces-cube li {
	position: relative;
	padding-left: 24px;
	margin-bottom: 1px;
	font-family: var(--wp--preset--font-family--roboto);
	color: #54595F;
}
.wp-block-list.is-style-puces-cube li::before {
	content: "";
	position: absolute;
	left: 0;
	top: .3em;
	width: 14px;
	height: 14px;
	background: var(--wp--preset--color--or);
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 448 512'%3E%3Cpath d='M201 10.3c14.3-7.8 31.6-7.8 46 0L422.3 106c5.1 2.8 8.3 8.2 8.3 14s-3.2 11.2-8.3 14L231.7 238c-4.8 2.6-10.5 2.6-15.3 0L25.7 134c-5.1-2.8-8.3-8.2-8.3-14s3.2-11.2 8.3-14L201 10.3zM23.7 170l176 96c5.1 2.8 8.3 8.2 8.3 14V496c0 5.6-3 10.9-7.8 13.8s-10.9 3-15.8 .3L25 423.1C9.6 414.7 0 398.6 0 381V184c0-5.6 3-10.9 7.8-13.8s10.9-3 15.8-.3zm400.7 0c5-2.7 11-2.6 15.8 .3s7.8 8.1 7.8 13.8V381c0 17.6-9.6 33.7-25 42.1L263.7 510c-5 2.7-11 2.6-15.8-.3s-7.8-8.1-7.8-13.8V280c0-5.9 3.2-11.2 8.3-14l176-96z'/%3E%3C/svg%3E") center / contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 448 512'%3E%3Cpath d='M201 10.3c14.3-7.8 31.6-7.8 46 0L422.3 106c5.1 2.8 8.3 8.2 8.3 14s-3.2 11.2-8.3 14L231.7 238c-4.8 2.6-10.5 2.6-15.3 0L25.7 134c-5.1-2.8-8.3-8.2-8.3-14s3.2-11.2 8.3-14L201 10.3zM23.7 170l176 96c5.1 2.8 8.3 8.2 8.3 14V496c0 5.6-3 10.9-7.8 13.8s-10.9 3-15.8 .3L25 423.1C9.6 414.7 0 398.6 0 381V184c0-5.6 3-10.9 7.8-13.8s10.9-3 15.8-.3zm400.7 0c5-2.7 11-2.6 15.8 .3s7.8 8.1 7.8 13.8V381c0 17.6-9.6 33.7-25 42.1L263.7 510c-5 2.7-11 2.6-15.8-.3s-7.8-8.1-7.8-13.8V280c0-5.9 3.2-11.2 8.3-14l176-96z'/%3E%3C/svg%3E") center / contain no-repeat;
}

/* Bouton « contour blanc » (diaporama d'accueil) */
.wp-block-button.is-style-contour-blanc .wp-block-button__link {
	background: transparent;
	color: #fff;
	border: 2px solid #fff;
	border-radius: 3px;
	padding: 12px 24px;
	font-family: var(--wp--preset--font-family--roboto);
	font-size: 15px;
	line-height: 1;
}
.wp-block-button.is-style-contour-blanc .wp-block-button__link:hover { background: #fff; color: #131730; }

/* ==========================================================================
   Accueil : diaporama plein écran + étiquettes (3D Réunion / chiffres)
   ========================================================================== */
.accueil-diaporama { position: relative; }

.accueil-diaporama .wp-block-cover {
	min-height: calc(100svh - var(--phi-entete, 102px)) !important;
	padding: 50px;
	align-items: center;
}
body.admin-bar .accueil-diaporama .wp-block-cover {
	min-height: calc(100svh - var(--phi-entete, 102px) - var(--wp-admin--admin-bar--height, 32px)) !important;
}

.diapo-encart {
	display: inline-block;
	background: rgba(19, 23, 49, .5);
	padding: 25px;
}
.diapo-encart > * + * { margin-top: 20px; }
.diapo-encart .diapo-titre {
	font-family: var(--wp--preset--font-family--roboto);
	font-size: 35px;
	font-weight: 300;
	line-height: 1;
	text-transform: uppercase;
	color: #fff;
	margin: 0;
}
.diapo-encart .diapo-texte {
	font-family: var(--wp--preset--font-family--roboto);
	font-size: 17px;
	font-weight: 200;
	line-height: 1.4;
	color: #fff !important;
	margin: 0;
}

.etiquette-accueil {
	position: absolute;
	z-index: 5;
	margin: 0 !important;
	background: rgba(19, 23, 49, .56);
	padding: 5px 20px 5px 15px;
	font-family: var(--wp--preset--font-family--roboto) !important;
	font-size: 17px !important;
	font-weight: 300 !important;
	line-height: 17px !important;
	text-transform: uppercase;
	color: #fff !important;
}
.etiquette-accueil--haut { top: 32px; left: 52px; }
.etiquette-accueil--bas-1 { right: 0; bottom: 144px; }
.etiquette-accueil--bas-2 { right: 0; bottom: 82px; }
@media (max-width: 767px) {
	.etiquette-accueil--haut { left: 10px; top: 10px; }
	.etiquette-accueil { font-size: 14px !important; }
}

/* ==========================================================================
   Carrousel (groupe de style « Carrousel ») — actif seulement sur le site ;
   dans l'éditeur les diapositives restent empilées pour être modifiées facilement.
   ========================================================================== */
:where(body:not(.editor-styles-wrapper)) .wp-block-group.is-style-carrousel {
	display: flex !important;
	flex-wrap: nowrap !important;
	gap: 0 !important;
	overflow-x: auto;
	scroll-snap-type: x mandatory;
	scrollbar-width: none;
	overscroll-behavior-x: contain;
}
:where(body:not(.editor-styles-wrapper)) .wp-block-group.is-style-carrousel::-webkit-scrollbar { display: none; }
:where(body:not(.editor-styles-wrapper)) .wp-block-group.is-style-carrousel > * {
	flex: 0 0 100%;
	margin: 0 !important;
	scroll-snap-align: start;
	max-width: none !important;
}
.phi-carrousel { position: relative; }
.phi-carrousel__nav {
	position: absolute;
	left: 0;
	right: 0;
	bottom: 10px;
	display: flex;
	justify-content: center;
}
.phi-carrousel__point {
	position: relative;
	width: 24px;
	height: 24px;
	padding: 0;
	border: 0;
	background: transparent;
	cursor: pointer;
}
.phi-carrousel__point::before {
	content: "";
	position: absolute;
	inset: 9px;
	border-radius: 50%;
	background: #000;
	opacity: .2;
}
.phi-carrousel__point[aria-current="true"]::before { opacity: 1; }
.phi-carrousel__fleche {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	width: 40px;
	height: 40px;
	border: 0;
	background: transparent;
	color: rgba(238, 238, 238, .9);
	font-size: 40px;
	line-height: 1;
	cursor: pointer;
}
.phi-carrousel__fleche--prec { left: 10px; }
.phi-carrousel__fleche--suiv { right: 10px; }

/* ==========================================================================
   Galerie filtrable (onglets natifs) — barre de filtres comme l'original
   ========================================================================== */
.wp-block-tabs .wp-block-tab-list { justify-content: center; flex-wrap: wrap; gap: 0 35px; border: 0; margin-bottom: 40px; }
.wp-block-tabs .wp-block-tab-list [role="tab"] {
	background: #fff;
	border: 0;
	padding: 0;
	color: #000;
	font-family: var(--wp--preset--font-family--roboto);
	font-size: 14px;
	letter-spacing: 1px;
	text-transform: uppercase;
	cursor: pointer;
}
.wp-block-tabs .wp-block-tab-list [role="tab"]::after {
	content: "";
	display: block;
	height: 2px;
	width: 0;
	background: #000;
	transition: width .5s ease;
}
.wp-block-tabs .wp-block-tab-list [role="tab"]:hover::after,
.wp-block-tabs .wp-block-tab-list [aria-selected="true"]::after { width: 100%; }

.wp-block-gallery.has-nested-images figure.wp-block-image img { aspect-ratio: 3 / 2; object-fit: cover; }

/* Vidéos intégrées : format 16/9 */
.wp-block-embed.is-type-video iframe { width: 100%; height: auto; aspect-ratio: 16 / 9; }

/* Articles (anciens contenus) : images centrées, pleine largeur */
.wp-block-image img { margin: 0 auto; }
.single .wp-block-post-content .wp-block-image img { width: 100%; }

/* Diaporama d'accueil : espacements et lettrage d'origine */
.diapo-encart .diapo-titre { letter-spacing: .4px; }
.diapo-encart .diapo-texte { letter-spacing: .3px; }
.diapo-encart > .diapo-texte { margin-top: 11px; }

/* ==========================================================================
   Vignettes vidéo (bloc Image, style « Vignette vidéo ») : miniature 16/9, clic = lecture
   ========================================================================== */
.wp-block-image.is-style-video,
.wp-block-image.is-style-video-lecture { position: relative; margin: 0 0 20px; }
.wp-block-image.is-style-video img,
.wp-block-image.is-style-video-lecture img {
	width: 100%;
	height: auto;
	aspect-ratio: 16 / 9;
	object-fit: cover;
	display: block;
}
.wp-block-image.is-style-video-lecture a::after {
	content: "";
	position: absolute;
	left: 50%;
	top: 50%;
	width: 80px;
	height: 80px;
	transform: translate(-50%, -50%);
	background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 80 80'%3E%3Ccircle cx='40' cy='40' r='38' fill='rgba(0,0,0,.35)'/%3E%3Cpath d='M32 25v30l24-15z' fill='%23fff'/%3E%3C/svg%3E") center / contain no-repeat;
	pointer-events: none;
}
.phi-video__lecteur { display: block; width: 100%; height: auto; aspect-ratio: 16 / 9; border: 0; }

/* Encadré de couleur derrière un logo blanc (ex. Entreprendre Pour Apprendre) */
.encadre-logo { line-height: 0; }
.encadre-logo .wp-block-image { margin: 0; }

/* En-tête sur une seule ligne dès que l'écran le permet (logo, menu, réseaux, drapeaux) */
.site-header__inner { max-width: 1400px; }
@media (min-width: 1240px) {
	.site-header__inner { align-items: center !important; }
	.site-header__inner > .wp-block-group,
	.site-header .wp-block-navigation__container,
	.site-header .wp-block-social-links { flex-wrap: nowrap !important; }
	.site-header .reseaux-drapeaux { flex-shrink: 0; }
	.site-header .wp-block-navigation a { padding: 8px 6px; white-space: nowrap; }
	.site-header .drapeaux img { margin: 8px 4px; }
}

/* ==========================================================================
   Téléphone (moins de 782 px) : diaporama plus lisible, en-tête plus compact
   ========================================================================== */
@media (max-width: 781px) {
	/* En-tête : marges réduites, logo plus petit, réseaux + drapeaux sur une ligne */
	.site-header__inner { padding: 10px 12px; flex-wrap: wrap !important; align-items: center !important; }
	.site-header .wp-block-site-logo img { width: 170px; height: 42px; }
	.site-header__inner > .wp-block-group { flex-wrap: wrap !important; align-items: center; }
	.site-header .reseaux-drapeaux { flex-wrap: nowrap !important; }
	.site-header .wp-block-social-links .wp-social-link { margin: 4px !important; }
	.site-header .drapeaux img { width: 36px; height: 24px; margin: 4px; }

	/* Diaporama : l'image en haut (format 4/3, presque entière), le texte dessous sur fond bleu nuit */
	.accueil-diaporama .wp-block-cover,
	body.admin-bar .accueil-diaporama .wp-block-cover {
		min-height: 0 !important;
		padding: calc(75vw + 14px) 16px 44px;
		align-items: flex-start;
		background: #131731;
	}
	.accueil-diaporama .wp-block-cover__image-background,
	.accueil-diaporama .wp-block-cover__background {
		height: 75vw !important;
		bottom: auto !important;
	}
	.accueil-diaporama .wp-block-cover__inner-container { width: 100%; }
	.diapo-encart { display: block; background: transparent; padding: 0; }
	.phi-carrousel__point::before { background: #fff; opacity: .35; }
	.phi-carrousel__point[aria-current="true"]::before { background: var(--wp--preset--color--or); opacity: 1; }
	/* Cadrage horizontal de l'image sur téléphone, réglable par diapositive :
	   bloc Couverture > Avancé > Classe CSS « cadrage-mobile-0 » (gauche) à « cadrage-mobile-100 » (droite) */
	.cadrage-mobile-0 .wp-block-cover__image-background { object-position: 0% 50% !important; }
	.cadrage-mobile-10 .wp-block-cover__image-background { object-position: 10% 50% !important; }
	.cadrage-mobile-20 .wp-block-cover__image-background { object-position: 20% 50% !important; }
	.cadrage-mobile-30 .wp-block-cover__image-background { object-position: 30% 50% !important; }
	.cadrage-mobile-40 .wp-block-cover__image-background { object-position: 40% 50% !important; }
	.cadrage-mobile-50 .wp-block-cover__image-background { object-position: 50% 50% !important; }
	.cadrage-mobile-60 .wp-block-cover__image-background { object-position: 60% 50% !important; }
	.cadrage-mobile-70 .wp-block-cover__image-background { object-position: 70% 50% !important; }
	.cadrage-mobile-80 .wp-block-cover__image-background { object-position: 80% 50% !important; }
	.cadrage-mobile-90 .wp-block-cover__image-background { object-position: 90% 50% !important; }
	.cadrage-mobile-100 .wp-block-cover__image-background { object-position: 100% 50% !important; }
	.diapo-encart .diapo-titre { font-size: 20px; }
	.diapo-encart .diapo-texte { font-size: 14px; margin-top: 6px; }
	.diapo-encart > * + * { margin-top: 10px; }
	.wp-block-button.is-style-contour-blanc .wp-block-button__link { padding: 8px 16px; font-size: 14px; }
	.phi-carrousel__fleche { display: none; } /* on fait défiler au doigt */

	/* Étiquettes : sous le diaporama au lieu de recouvrir l'image.
	   Le bloc d'accueil occupe tout l'écran (comme l'original), étiquettes calées en bas. */
	.accueil-diaporama {
		display: flex;
		flex-direction: column;
		min-height: calc(100svh - var(--phi-entete, 94px));
		background: #131731;
	}
	body.admin-bar .accueil-diaporama { min-height: calc(100svh - var(--phi-entete, 94px) - var(--wp-admin--admin-bar--height, 46px)); }
	.accueil-diaporama > .etiquette-accueil--haut { margin-top: auto !important; }
	.accueil-diaporama > .phi-carrousel { order: 0; }
	.etiquette-accueil { position: static; order: 1; align-self: stretch; text-align: center; background: #131731; padding: 10px 15px; }
	.etiquette-accueil--haut { order: 1; }
	.etiquette-accueil--bas-1 { order: 2; }
	.etiquette-accueil--bas-2 { order: 3; }
}

/* Pied de page vide (comme l'original) : pas d'espace blanc réservé en bas des pages */
.wp-site-blocks > .wp-block-template-part:empty { display: none; }

/* Bandeaux en haut des pages (images 1920 x 250) : sur téléphone uniquement, la hauteur suit
   la largeur de l'écran pour éviter l'effet de zoom (tablette et ordinateur : 250 px inchangé). */
@media (max-width: 781px) {
	.wp-block-image.bandeau-page img { height: 25vw !important; }
}

/* Titres sous les vignettes vidéo */
.wp-block-image.is-style-video figcaption,
.wp-block-image.is-style-video-lecture figcaption {
	margin: 8px 0 0;
	font-family: var(--wp--preset--font-family--roboto);
	font-size: 14px;
	line-height: 1.35;
	color: #131730;
	text-align: left;
}

/* Cartes de réalisations (blocs « Nos réalisations », pages de catégories) */
.carte-realisation .wp-block-post-featured-image { margin: 0; overflow: hidden; }
.carte-realisation .wp-block-post-featured-image img { width: 100%; aspect-ratio: 3 / 2; object-fit: cover; transition: transform .4s ease; }
.carte-realisation:hover .wp-block-post-featured-image img { transform: scale(1.03); }
.carte-realisation .wp-block-post-title { margin: 0; font-family: var(--wp--preset--font-family--roboto); font-weight: 400; line-height: 1.35; }
.carte-realisation .wp-block-post-title a { color: #131730; text-decoration: none; }
.carte-realisation .wp-block-post-title a:hover { color: var(--wp--preset--color--or); }

/* Lien vers la prestation en bas d'une réalisation */
.lien-prestation { margin-top: 40px; padding-top: 16px; border-top: 1px solid #e5e5e5; font-family: var(--wp--preset--font-family--roboto); font-size: 15px; }

/* Agrandissement des images recopiées dans l'onglet « Tout » */
.phi-agrandissement {
	position: fixed;
	inset: 0;
	z-index: 100000;
	display: flex;
	align-items: center;
	justify-content: center;
	background: rgba(0, 0, 0, .9);
	cursor: zoom-out;
}
.phi-agrandissement img { max-width: 94vw; max-height: 92vh; width: auto; height: auto; object-fit: contain; }

/* FAQ des prestations (bloc Accordéon) */
.faq-prestation .wp-block-accordion { border-top: 1px solid #e3e3e3; }
.faq-prestation .wp-block-accordion-item { border-bottom: 1px solid #e3e3e3; }
.faq-prestation .wp-block-accordion-heading { margin: 0; font-family: var(--wp--preset--font-family--roboto); font-size: 17px; font-weight: 500; color: #131730; }
.faq-prestation .wp-block-accordion-heading__toggle { padding: 16px 0; width: 100%; text-align: left; background: none; border: 0; color: inherit; font: inherit; cursor: pointer; }
.faq-prestation .wp-block-accordion-heading__toggle-icon { color: var(--wp--preset--color--or); font-size: 22px; }
.faq-prestation .wp-block-accordion-panel p { margin: 0 0 16px; }

/* Texte de présentation de l'accueil */
.presentation-accueil p { font-family: var(--wp--preset--font-family--roboto); color: var(--wp--preset--color--gris-texte); font-size: 17px; text-align: center; }
.presentation-accueil h1 { font-size: min(calc(1.3rem + 1vw), 2.2rem); }

/* Bouton « FAQ ↓ » sous le titre des pages de prestation (style « Bouton FAQ » dans l'éditeur) */
.bouton-faq-zone { margin-top: 10px !important; margin-bottom: 10px !important; }
.wp-block-button.is-style-bouton-faq .wp-block-button__link {
	background: var(--wp--preset--color--bleu-nuit);
	color: var(--wp--preset--color--or);
	border: 2px solid var(--wp--preset--color--or);
	border-radius: 3px;
	padding: 8px 22px;
	font-family: var(--wp--preset--font-family--roboto);
	font-size: 15px;
	font-weight: 500;
	letter-spacing: .5px;
	text-decoration: none;
	transition: background .25s ease, color .25s ease;
}
.wp-block-button.is-style-bouton-faq .wp-block-button__link:hover,
.wp-block-button.is-style-bouton-faq .wp-block-button__link:focus-visible {
	background: var(--wp--preset--color--or);
	color: var(--wp--preset--color--bleu-nuit);
}

/* Ancres : la cible s'arrête sous l'en-tête fixe. Le défilement doux est fait en JS au clic
   (haut-de-page.js), pas en CSS global : un saut direct en bas de page ne charge pas toute la galerie. */
#faq { scroll-margin-top: calc(var(--phi-entete, 102px) + var(--wp-admin--admin-bar--height, 0px) + 16px); }

/* Bouton « Remonter en haut de la page » : rond bleu nuit et or, en bas à droite, visible après défilement */
.phi-haut {
	position: fixed;
	right: 20px;
	bottom: 20px;
	z-index: 900;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 46px;
	height: 46px;
	padding: 0;
	border: 2px solid var(--wp--preset--color--or);
	border-radius: 50%;
	background: var(--wp--preset--color--bleu-nuit);
	color: var(--wp--preset--color--or);
	box-shadow: 0 4px 14px rgba(0, 0, 0, .25);
	cursor: pointer;
	opacity: 0;
	visibility: hidden;
	transform: translateY(10px);
	transition: opacity .25s ease, transform .25s ease, visibility .25s, background .25s ease, color .25s ease;
}
.phi-haut.is-visible { opacity: 1; visibility: visible; transform: none; }
.phi-haut:hover,
.phi-haut:focus-visible { background: var(--wp--preset--color--or); color: var(--wp--preset--color--bleu-nuit); }
@media (max-width: 781px) { .phi-haut { right: 14px; bottom: 14px; width: 42px; height: 42px; } }
@media (prefers-reduced-motion: reduce) { .phi-haut { transition: none; } }
/* Téléphone : espace en fin de page pour que le bouton « haut de page » ne recouvre jamais le dernier contenu */
@media (max-width: 781px) { body:not(.home) .wp-site-blocks { padding-bottom: 70px; } }

/* ==========================================================================
   Menu mobile (bouton ☰) : bouton visible avec le mot « Menu »,
   liens centrés en grands boutons faciles à toucher, page en cours en or
   ========================================================================== */
.site-header .wp-block-navigation__responsive-container-open {
	display: flex;
	align-items: center;
	gap: 6px;
	padding: 8px 12px;
	min-height: 44px;
	border: 2px solid var(--wp--preset--color--or);
	border-radius: 4px;
	color: var(--wp--preset--color--or);
	background: transparent;
}
.site-header .wp-block-navigation__responsive-container-open svg { width: 24px; height: 24px; fill: currentColor; }
.site-header .wp-block-navigation__responsive-container-open::after {
	content: "Menu";
	font-family: var(--wp--preset--font-family--roboto);
	font-size: 15px;
	font-weight: 500;
	letter-spacing: .5px;
	text-transform: uppercase;
}
.site-header .wp-block-navigation__responsive-container-open:hover,
.site-header .wp-block-navigation__responsive-container-open:focus-visible { background: var(--wp--preset--color--or); color: var(--wp--preset--color--bleu-nuit); }

/* Panneau ouvert */
.site-header .wp-block-navigation__responsive-container.is-menu-open { padding: 20px 24px 40px !important; }
.site-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-close {
	top: 18px;
	right: 18px;
	width: 48px;
	height: 48px;
	display: flex;
	align-items: center;
	justify-content: center;
	border: 2px solid var(--wp--preset--color--or);
	border-radius: 50%;
	color: var(--wp--preset--color--or);
}
.site-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-close svg { width: 26px; height: 26px; fill: currentColor; }
.site-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content {
	padding-top: 70px !important;
	align-items: stretch !important;
}
.site-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container {
	width: 100%;
	max-width: 420px;
	margin: 0 auto;
	align-items: stretch !important;
	gap: 12px !important;
}
.site-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item { width: 100%; }
.site-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content {
	display: flex !important;
	align-items: center;
	justify-content: center;
	width: 100%;
	min-height: 52px;
	padding: 12px 20px !important;
	border: 1px solid rgba(221, 162, 95, .55);
	border-radius: 6px;
	background: rgba(255, 255, 255, .05);
	color: #fff !important;
	font-family: var(--wp--preset--font-family--roboto);
	font-size: 19px !important;
	text-align: center;
	transition: background .2s ease, color .2s ease, border-color .2s ease;
}
.site-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content:hover,
.site-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content:focus-visible,
.site-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content:active {
	background: var(--wp--preset--color--or);
	border-color: var(--wp--preset--color--or);
	color: var(--wp--preset--color--bleu-nuit) !important;
}
/* Page en cours : bouton or plein */
.site-header .wp-block-navigation__responsive-container.is-menu-open .current-menu-item > .wp-block-navigation-item__content,
.site-header .wp-block-navigation__responsive-container.is-menu-open [aria-current="page"] {
	background: var(--wp--preset--color--or);
	border-color: var(--wp--preset--color--or);
	color: var(--wp--preset--color--bleu-nuit) !important;
	font-weight: 500;
}
.site-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content,
.site-header .wp-block-navigation__responsive-container-open { box-sizing: border-box; }

/* Accueil sur téléphone : plus de remplissage plein écran (le texte de présentation suit désormais le diaporama) */
@media (max-width: 781px) {
	.accueil-diaporama,
	body.admin-bar .accueil-diaporama { min-height: 0 !important; }
	.accueil-diaporama > .etiquette-accueil--haut { margin-top: 0 !important; }
	.accueil-diaporama .phi-carrousel { margin-bottom: 0 !important; }
	.presentation-accueil { padding-top: 32px !important; padding-bottom: 32px !important; }
}
/* Bouton menu mobile : icône ☰ seule (sans le mot « Menu »), carré cerclé d'or de 44 px */
.site-header .wp-block-navigation__responsive-container-open::after { content: none; }
.site-header .wp-block-navigation__responsive-container-open { width: 44px; height: 44px; padding: 0; justify-content: center; }

/* ==========================================================================
   Téléphone : en-tête = logo + ☰ (sans contour) ; réseaux et drapeaux dans le pied de page.
   Sur ordinateur, le pied de page reste masqué : l'affichage d'origine est inchangé.
   ========================================================================== */
.pied-mobile { display: none; }
@media (min-width: 782px) {
	.wp-site-blocks > .wp-block-template-part:has(> .pied-mobile) { display: none; }
}
@media (max-width: 781px) {
	/* En-tête : logo à gauche, ☰ à droite, sur une ligne */
	.site-header .reseaux-drapeaux { display: none !important; }
	.site-header__inner { flex-wrap: nowrap !important; justify-content: space-between !important; }
	.site-header__inner > .wp-block-group { flex-wrap: nowrap !important; justify-content: flex-end !important; }
	.site-header .wp-block-navigation__responsive-container-open { border: 0; background: transparent; color: #fff; width: 44px; height: 44px; }
	.site-header .wp-block-navigation__responsive-container-open svg { width: 30px; height: 30px; }

	/* Pied de page : réseaux sociaux + drapeaux centrés sur fond bleu nuit */
	.pied-mobile {
		display: block;
		background: #131731;
		padding: 18px 16px 76px; /* 76 px : place pour le bouton « haut de page » */
	}
	.wp-site-blocks > .wp-block-template-part:has(> .pied-mobile) { margin-top: 0 !important; }
	.pied-mobile .wp-block-social-links .wp-social-link {
		background: #DDA35F !important;
		color: #fff !important;
		border-radius: 5px;
		margin: 6px !important;
	}
	.pied-mobile .wp-block-social-links .wp-social-link a { padding: 6px; }
	.pied-mobile .wp-block-social-links .wp-social-link svg { width: 20px; height: 20px; }
	.pied-mobile .drapeaux img { display: block; width: 48px; height: 32px; margin: 6px; }
	.pied-mobile .wp-block-social-links { margin: 0; }

	/* L'espace pour le bouton « haut de page » est désormais dans le pied de page */
	body:not(.home) .wp-site-blocks { padding-bottom: 0; }
}

/* Accueil sur téléphone : premier écran rempli de façon équilibrée (hauteurs calculées par carrousel.js) */
@media (max-width: 781px) {
	.accueil-diaporama,
	body.admin-bar .accueil-diaporama { min-height: var(--phi-accueil-h, auto) !important; }
	.accueil-diaporama .wp-block-cover,
	body.admin-bar .accueil-diaporama .wp-block-cover { padding-top: calc(var(--phi-img-h, 75vw) + 14px) !important; }
	.accueil-diaporama .wp-block-cover__image-background,
	.accueil-diaporama .wp-block-cover__background { height: var(--phi-img-h, 75vw) !important; }
	/* la place restante se partage au-dessus et au-dessous des trois étiquettes */
	.accueil-diaporama > .etiquette-accueil--haut { margin-top: auto !important; }
	.accueil-diaporama > .etiquette-accueil--bas-2 { margin-bottom: auto !important; }
}

/* Le bouton ☰ n'existe que sous 600 px (seuil du menu WordPress) : masqué au-delà, comme à l'origine */
@media (min-width: 600px) {
	.site-header .wp-block-navigation__responsive-container-open:not(.always-shown) { display: none !important; }
}
/* Tablette (600 à 781 px) : le menu complet peut passer à la ligne */
@media (min-width: 600px) and (max-width: 781px) {
	.site-header__inner > .wp-block-group { flex-wrap: wrap !important; }
}

/* Texte d'introduction sous le titre principal (texte d'origine de l'ancien titre long) */
.intro-page { max-width: 860px; margin-left: auto !important; margin-right: auto !important; font-size: 17px; line-height: 1.55; }

/* Plan d'accès (page Contact) : image cliquable vers Google Maps */
.wp-block-image.plan-acces img { width: 100%; height: auto; border: 1px solid #e3e3e3; }
.wp-block-image.plan-acces a:hover img { opacity: .9; }
.wp-block-image.plan-acces figcaption { font-family: var(--wp--preset--font-family--roboto); font-size: 13px; color: #7a7a7a; text-align: center; }

/* Réalisations : titre centré, comme sur les autres pages */
.single .wp-block-post-title { text-align: center; }

/* Galerie Perspective 3D : agrandissement au clic (assets/js/galerie-agrandie.js) */
.wp-block-tab-panel .wp-block-gallery figure.wp-block-image img { cursor: zoom-in; }
html.phi-agrandi-ouvert { overflow: hidden; }
.phi-agrandi {
	width: 100vw; height: 100dvh; max-width: none; max-height: none;
	margin: 0; padding: 0; border: 0;
	background: rgba(19, 23, 48, .96); color: #fff;
	display: none; align-items: center; justify-content: center;
}
.phi-agrandi[open] { display: flex; }
.phi-agrandi::backdrop { background: rgba(19, 23, 48, .96); }
.phi-agrandi__figure {
	margin: 0; width: 100%; height: 100%; padding: 56px 72px 16px;
	box-sizing: border-box; display: flex; flex-direction: column; align-items: center; justify-content: center;
}
.phi-agrandi__figure img {
	max-width: 100%; max-height: calc(100dvh - 140px); width: auto; height: auto; object-fit: contain;
	box-shadow: 0 4px 30px rgba(0, 0, 0, .5);
}
.phi-agrandi__figure figcaption {
	margin-top: 14px; text-align: center; font-size: 15px; line-height: 1.4; max-width: 900px;
}
.phi-agrandi__titre { font-weight: 600; }
.phi-agrandi__lien { color: var(--wp--preset--color--or); white-space: nowrap; margin-left: 8px; }
.phi-agrandi__lien:hover, .phi-agrandi__lien:focus { color: #fff; }
.phi-agrandi__compteur { display: block; margin-top: 4px; font-size: 13px; opacity: .7; }
.phi-agrandi button {
	position: absolute; background: none; border: 0; color: #fff; cursor: pointer;
	line-height: 1; padding: 8px 14px; border-radius: 4px;
}
.phi-agrandi button:hover, .phi-agrandi button:focus-visible { color: var(--wp--preset--color--or); }
.phi-agrandi button:focus-visible { outline: 2px solid var(--wp--preset--color--or); }
.phi-agrandi__fermer { top: 10px; right: 12px; font-size: 28px; }
.phi-agrandi__fleche { top: 50%; transform: translateY(-50%); font-size: 64px; }
.phi-agrandi__fleche--prec { left: 8px; }
.phi-agrandi__fleche--suiv { right: 8px; }
@media (max-width: 781px) {
	.phi-agrandi__figure { padding: 56px 8px 16px; }
	.phi-agrandi__fleche { top: auto; bottom: 8px; transform: none; font-size: 44px; }
	.phi-agrandi__figure img { max-height: calc(100dvh - 190px); }
}

/* ==========================================================================
   Réalisations (articles) : mise aux couleurs de la charte 3D phi
   Catégorie en or (Monsal Gothic), titre Agenda bleu nuit, textes Roboto gris
   sur une colonne de lecture, intertitres Agenda, puces « cube », liens or.
   ========================================================================== */
.article-3dphi .article-categorie {
	margin: 0 0 10px; text-align: center;
	font-family: var(--wp--preset--font-family--monsal-gothic);
	font-size: 18px; letter-spacing: .5px; color: var(--wp--preset--color--or);
}
.article-3dphi .article-categorie a { color: inherit; text-decoration: none; }
.article-3dphi .article-categorie a:hover { text-decoration: underline; }
.article-3dphi .article-titre {
	margin: 0 auto 28px; max-width: 900px; text-align: center;
	font-family: var(--wp--preset--font-family--agenda);
	font-weight: 700; font-size: clamp(28px, 3.2vw, 42px); line-height: 1.1;
	color: var(--wp--preset--color--bleu-nuit);
}
.article-3dphi .article-titre::after {
	content: ""; display: block; width: 60px; height: 3px; margin: 18px auto 0;
	background: var(--wp--preset--color--or);
}
/* Colonne de lecture : les textes restent sur 860 px, les images et vidéos gardent toute la largeur */
.article-3dphi .wp-block-post-content > :is(p, h2, h3, h4, ul, ol, .wp-block-list, .lien-prestation) {
	max-width: 860px; margin-left: auto !important; margin-right: auto !important;
}
.article-3dphi .wp-block-post-content p,
.article-3dphi .wp-block-post-content li {
	font-family: var(--wp--preset--font-family--roboto);
	font-size: 17px; line-height: 1.65; color: #54595F;
}
.article-3dphi .wp-block-post-content p strong { color: var(--wp--preset--color--bleu-nuit); }
.article-3dphi .wp-block-post-content h2 {
	margin-top: 2.2em; margin-bottom: .5em;
	font-family: var(--wp--preset--font-family--agenda);
	font-weight: 700; font-size: clamp(22px, 2.2vw, 28px); line-height: 1.15;
	color: var(--wp--preset--color--bleu-nuit);
}
.article-3dphi .wp-block-post-content h3 {
	margin-top: 1.8em; margin-bottom: .4em;
	font-family: var(--wp--preset--font-family--monsal-gothic);
	font-weight: 400; font-size: 21px; line-height: 1.2;
	color: var(--wp--preset--color--or);
}
.article-3dphi .wp-block-post-content a:not(.wp-element-button) {
	color: var(--wp--preset--color--bleu-nuit);
	text-decoration: underline; text-decoration-color: var(--wp--preset--color--or);
	text-decoration-thickness: 2px; text-underline-offset: 3px;
}
.article-3dphi .wp-block-post-content a:not(.wp-element-button):hover { color: var(--wp--preset--color--or); }
/* Listes : puces « cube » or, comme sur les pages */
.article-3dphi .wp-block-post-content ul:not(.wp-block-gallery):not(.wp-block-social-links) { list-style: none; padding-left: 0; }
.article-3dphi .wp-block-post-content ul:not(.wp-block-gallery):not(.wp-block-social-links) > li { position: relative; padding-left: 26px; margin-bottom: 4px; }
.article-3dphi .wp-block-post-content ul:not(.wp-block-gallery):not(.wp-block-social-links) > li::before {
	content: ""; position: absolute; left: 0; top: .35em; width: 14px; height: 14px;
	background: var(--wp--preset--color--or);
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 448 512'%3E%3Cpath d='M201 10.3c14.3-7.8 31.6-7.8 46 0L422.3 106c5.1 2.8 8.3 8.2 8.3 14s-3.2 11.2-8.3 14L231.7 238c-4.8 2.6-10.5 2.6-15.3 0L25.7 134c-5.1-2.8-8.3-8.2-8.3-14s3.2-11.2 8.3-14L201 10.3zM23.7 170l176 96c5.1 2.8 8.3 8.2 8.3 14V496c0 5.6-3 10.9-7.8 13.8s-10.9 3-15.8 .3L25 423.1C9.6 414.7 0 398.6 0 381V184c0-5.6 3-10.9 7.8-13.8s10.9-3 15.8-.3zm400.7 0c5-2.7 11-2.6 15.8 .3s7.8 8.1 7.8 13.8V381c0 17.6-9.6 33.7-25 42.1L263.7 510c-5 2.7-11 2.6-15.8-.3s-7.8-8.1-7.8-13.8V280c0-5.9 3.2-11.2 8.3-14l176-96z'/%3E%3C/svg%3E") center / contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 448 512'%3E%3Cpath d='M201 10.3c14.3-7.8 31.6-7.8 46 0L422.3 106c5.1 2.8 8.3 8.2 8.3 14s-3.2 11.2-8.3 14L231.7 238c-4.8 2.6-10.5 2.6-15.3 0L25.7 134c-5.1-2.8-8.3-8.2-8.3-14s3.2-11.2 8.3-14L201 10.3zM23.7 170l176 96c5.1 2.8 8.3 8.2 8.3 14V496c0 5.6-3 10.9-7.8 13.8s-10.9 3-15.8 .3L25 423.1C9.6 414.7 0 398.6 0 381V184c0-5.6 3-10.9 7.8-13.8s10.9-3 15.8-.3zm400.7 0c5-2.7 11-2.6 15.8 .3s7.8 8.1 7.8 13.8V381c0 17.6-9.6 33.7-25 42.1L263.7 510c-5 2.7-11 2.6-15.8-.3s-7.8-8.1-7.8-13.8V280c0-5.9 3.2-11.2 8.3-14l176-96z'/%3E%3C/svg%3E") center / contain no-repeat;
}
.article-3dphi .wp-block-post-content figcaption {
	font-family: var(--wp--preset--font-family--roboto); font-size: 14px; color: #7a7a7a; text-align: center;
}
/* Bas de réalisation : liens vers la prestation et la catégorie, en encadré sobre */
.article-3dphi .lien-prestation {
	margin-top: 48px; padding: 18px 20px; border-top: 3px solid var(--wp--preset--color--or);
	background: #f6f6f8; text-align: center; font-size: 16px;
}
.article-3dphi .lien-prestation a { font-weight: 600; }
@media (max-width: 781px) {
	.article-3dphi .wp-block-post-content p, .article-3dphi .wp-block-post-content li { font-size: 16px; }
	.article-3dphi { padding-top: 1.5rem !important; }
}

/* Note EcoIndex sous le badge (page À propos) */
.note-ecoindex {
	margin: 6px 0 12px; text-align: center;
	font-family: var(--wp--preset--font-family--roboto); font-size: 18px;
	color: var(--wp--preset--color--bleu-nuit);
}
.note-ecoindex strong { font-size: 22px; }

/* Réalisation ouverte depuis la galerie : bouton « Retour à la galerie » (haut-de-page.js) */
.phi-retour-galerie-zone { text-align: center; margin: 0 0 14px; }
.article-3dphi .wp-block-post-content + .phi-retour-galerie-zone,
.lien-prestation + .phi-retour-galerie-zone { margin-top: 20px; }
.phi-retour-galerie {
	display: inline-block; padding: 8px 18px; border: 1px solid var(--wp--preset--color--or); border-radius: 3px;
	font-family: var(--wp--preset--font-family--roboto); font-size: 15px; text-decoration: none;
	color: var(--wp--preset--color--bleu-nuit); background: #fff; transition: background .2s, color .2s;
}
.phi-retour-galerie:hover, .phi-retour-galerie:focus-visible { background: var(--wp--preset--color--or); color: #fff; }

/* Pied de page mobile construit par haut-de-page.js : contenu centré */
.pied-mobile .reseaux-drapeaux { justify-content: center !important; }


/* Galeries longues : bouton « Voir plus de réalisations » (onglets.js) */
.phi-galerie-plus {
	display: block; margin: 28px auto 0; padding: 10px 26px;
	border: 2px solid var(--wp--preset--color--or); border-radius: 3px;
	background: var(--wp--preset--color--bleu-nuit); color: var(--wp--preset--color--or);
	font-family: var(--wp--preset--font-family--roboto); font-size: 15px; font-weight: 500; letter-spacing: .5px;
	cursor: pointer; transition: background .25s ease, color .25s ease;
}
.phi-galerie-plus:hover,
.phi-galerie-plus:focus-visible { background: var(--wp--preset--color--or); color: var(--wp--preset--color--bleu-nuit); }

/* Réalisations : cadre d'une image qui s'affichera au défilement (video.js) */
.phi-image-attente { width: 100%; background: #eeeef1; cursor: pointer; }

/* Retours à la ligne des titres et paragraphes (functions.php, sans balise <br>) */
.phi-br { white-space: pre-line; }