/*
Theme Name: Bresson & Cheval
Theme URI: https://avocats-bresson-cheval.fr/
Author: Cabinet Bresson & Cheval
Description: Thème WordPress FSE (Full Site Editing) du cabinet d'avocats Bresson & Cheval — Besançon, Baume-les-Dames, Villers-le-Lac. Construit uniquement avec des blocs natifs Gutenberg : en-tête, pied de page, accueil et pages sont entièrement modifiables depuis l'éditeur de site.
Requires at least: 6.6
Tested up to: 7.1
Requires PHP: 8.1
Version: 1.1.0
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: bresson-cheval
Tags: full-site-editing, block-patterns, block-styles, custom-colors, editor-style, one-column, wide-blocks, translation-ready
*/

/* ==========================================================================
   1. Base
   ========================================================================== */

body {
	--cheval-inset: var(--wp--custom--inset, 26px);
	-webkit-font-smoothing: antialiased;
}

@media (max-width: 980px) {
	body {
		--cheval-inset: var(--wp--custom--inset-mobile, 20px);
	}
}

*,
*::before,
*::after {
	box-sizing: border-box;
}

html {
	scroll-behavior: smooth;
}

@media (prefers-reduced-motion: reduce) {
	html {
		scroll-behavior: auto;
	}
}

/* En-tête, héros, contenu et pied de page sont collés les uns aux autres. */
body .wp-site-blocks > * {
	margin-block-start: 0;
	margin-block-end: 0;
}

/* Titre H1 du site, lisible par les moteurs et lecteurs d'écran uniquement. */
.cheval-sr-only {
	position: absolute !important;
	width: 1px;
	height: 1px;
	margin: -1px !important;
	padding: 0;
	overflow: hidden;
	clip-path: inset(50%);
	white-space: nowrap;
	border: 0;
}

/* Filet fin sous les titres (bloc Séparateur, style « Large »). */
.wp-block-separator.cheval-rule {
	width: 100%;
	max-width: var(--cheval-rule-width, none);
	height: 0;
	margin: 4px 0 16px;
	border: 0;
	border-top: 1px solid var(--wp--preset--color--line);
	background: none;
	opacity: 1;
}

.wp-block-separator.cheval-rule--296 { --cheval-rule-width: 296px; }
.wp-block-separator.cheval-rule--312 { --cheval-rule-width: 312px; }
.wp-block-separator.cheval-rule--148 { --cheval-rule-width: 148px; }

/* Puces en losange (listes des compétences et de l'équipe). */
.wp-block-list.cheval-diamonds {
	margin: 0;
	padding: 0;
	list-style: none;
}

.cheval-diamonds li {
	display: flex;
	align-items: center;
	gap: 8px;
}

.cheval-diamonds li::before {
	content: "";
	display: block;
	flex: none;
	width: 5px;
	height: 5px;
	background: currentColor;
	transform: rotate(45deg);
}

/* ==========================================================================
   2. En-tête : logo + navigation
   ========================================================================== */

header.wp-block-template-part {
	position: relative;
	z-index: 10;
	background: var(--wp--preset--color--white);
}

.cheval-header__inner {
	max-width: 1080px;
	min-height: 134px;
	margin-inline: auto;
	padding: 0 20px;
	gap: 20px;
}

.wp-block-image.cheval-logo {
	margin: 0;
	flex: 0 1 auto;
	min-width: 0;
}

.cheval-logo a {
	display: block;
}

.cheval-logo img {
	display: block;
	width: auto;
	max-width: 100%;
	height: 78px;
}

.cheval-nav {
	position: static; /* le menu mobile se cale sur l'en-tête */
}

.cheval-nav .wp-block-navigation-item__content:hover {
	opacity: 0.7;
}

/* Bouton burger : 3 barres de 24 × 3 px, zone tactile 44 × 44 px. */
.cheval-nav .wp-block-navigation__responsive-container-open {
	min-width: 44px;
	min-height: 44px;
	padding: 10px;
	align-items: center;
	justify-content: center;
	color: var(--wp--preset--color--primary);
}

.cheval-nav .wp-block-navigation__responsive-container-open svg {
	display: none;
}

.cheval-nav .wp-block-navigation__responsive-container-open::before {
	content: "";
	display: block;
	width: 24px;
	height: 3px;
	background: currentColor;
	box-shadow: 0 8px 0 currentColor, 0 -8px 0 currentColor;
}

@media (max-width: 980px) {
	.cheval-header__inner {
		min-height: 80px;
	}

	.cheval-logo img {
		height: 54px;
	}

	/* Le bloc Navigation bascule en burger à 600 px ; le design le veut à 980 px. */
	.cheval-nav .wp-block-navigation__responsive-container-open:not(.always-shown) {
		display: flex;
	}

	.cheval-nav .wp-block-navigation__responsive-container:not(.hidden-by-default):not(.is-menu-open) {
		display: none;
	}
}

/* Menu déroulant sous l'en-tête (au lieu de l'overlay plein écran). */
.cheval-nav .wp-block-navigation__responsive-container.is-menu-open {
	--navigation-layout-justification-setting: stretch;
	position: absolute;
	inset: 100% 0 auto 0;
	height: auto;
	overflow: visible; /* la croix déborde sur le bouton burger */
	border-top: 3px solid var(--wp--preset--color--primary);
	box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
	animation: none;
}

.cheval-nav .wp-block-navigation__responsive-container.is-menu-open:not(.disable-default-overlay) {
	padding: 16px 20px 12px;
}

.cheval-nav .wp-block-navigation__responsive-container.is-menu-open:not(.disable-default-overlay) .wp-block-navigation__responsive-container-content {
	padding-top: 0;
}

.cheval-nav .is-menu-open .wp-block-navigation__container {
	width: 100%;
	align-items: stretch;
}

.cheval-nav .is-menu-open .wp-block-navigation__responsive-container-content .wp-block-navigation-item {
	width: 100%;
	border-bottom: 1px solid rgba(0, 0, 0, 0.03);
}

.cheval-nav .is-menu-open .wp-block-navigation__responsive-container-content .wp-block-navigation-item:last-child {
	border-bottom: 0;
}

.cheval-nav .is-menu-open .wp-block-navigation__responsive-container-content .wp-block-navigation-item__content {
	display: block;
	padding: 10px 5%;
	font-size: 14px;
	text-align: left;
}

/* La croix se superpose exactement au bouton burger : il fait office de bascule.
   Elle se positionne par rapport au « dialog » (3 px de bordure + 16 px de padding sous l'en-tête). */
.cheval-nav .wp-block-navigation__responsive-container-close {
	top: -81px;
	right: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	padding: 10px;
	background: var(--wp--preset--color--white);
	color: var(--wp--preset--color--primary);
}

/* ==========================================================================
   3. Héros : photo | adresses | photo
   ========================================================================== */

.wp-block-group.cheval-hero {
	flex-wrap: wrap;
	align-items: stretch;
	gap: 0;
	margin: 0;
	padding: 0;
	background: var(--wp--preset--color--white);
}

.cheval-hero > * {
	margin: 0;
}

.wp-block-image.cheval-hero__photo {
	margin: 0;
}

.cheval-hero__photo img {
	display: block;
	width: 100%;
	height: 400px;
	object-fit: cover;
}

.cheval-hero__photo--left {
	flex: 1220 1 300px;
	order: 0;
}

.cheval-hero__photo--right {
	flex: 475 1 200px;
	order: 2;
}

.wp-block-group.cheval-hero__box {
	flex: 0 0 226px;
	order: 1;
	gap: 0;
	padding: 18px 20px 4px;
	background: var(--wp--preset--color--white);
	font-size: 13px;
	line-height: 14px;
	text-align: center;
}

.cheval-hero__box > * {
	margin: 0;
}

.cheval-hero__box .cheval-rule {
	margin: 0 0 16px;
}

.cheval-hero__box .cheval-rule:last-of-type {
	margin: 22px 0 8px;
}

.wp-block-group.cheval-hero__sites {
	gap: 14px;
}

.cheval-hero__site {
	margin: 0;
	font-size: 13px;
	line-height: 14px;
}

.cheval-hero__site strong {
	display: inline-block;
	vertical-align: top;
	margin-bottom: 6px;
	font-size: 12.5px;
	font-weight: 700;
	text-transform: uppercase;
}

.wp-block-image.cheval-diamond {
	margin: 0;
}

.cheval-diamond img {
	display: block;
	width: 12px;
	height: auto;
}

.cheval-hero__tel {
	font-size: 13px;
	line-height: 24px;
}

@media (max-width: 980px) {
	.cheval-hero__photo img {
		height: 240px;
	}

	.wp-block-group.cheval-hero__box {
		flex: 0 0 100%;
	}

	.cheval-hero__photo--left {
		order: 2;
	}

	.cheval-hero__photo--right {
		display: none;
	}
}

/* ==========================================================================
   4. Sections de la page d'accueil
   ========================================================================== */

/* Conteneurs de 1080 px centrés (les pourcentages se calculent sur cette largeur). */
.cheval-main,
.cheval-footer {
	max-width: 1080px;
	margin-inline: auto;
}

/* Sections collées les unes aux autres : aucun espacement de bloc entre elles. */
.wp-block-post-content > .cheval-hero,
.wp-block-post-content > .cheval-main,
.cheval-main > *,
.cheval-footer > *,
.cheval-bureaux > * {
	margin-block: 0;
}

.cheval-section :is(h2, h3) {
	margin: 0;
}

.cheval-section p {
	margin: 0;
	line-height: 24px;
}

/* — Le cabinet — */
.cheval-cabinet {
	padding: 96px 0 84px var(--cheval-inset);
}

.cheval-cabinet strong {
	color: var(--wp--preset--color--primary);
	font-weight: 700;
}

/* — Nos compétences (bandeau bleu) — */
.wp-block-group.cheval-competences {
	flex-wrap: wrap;
	align-items: flex-start;
	gap: 12px 52px;
	padding: 15px 26px 18px;
}

.cheval-competences__text {
	flex: 462 1 300px;
	min-width: 0;
}

.cheval-competences__photo {
	flex: 513 1 280px;
	min-width: 0;
	padding-top: 6px;
}

.cheval-competences .cheval-rule {
	margin: 4px 0 14px;
}

.cheval-competences .wp-block-list.cheval-diamonds {
	margin-bottom: 14px;
	padding-left: 4px;
	font-size: 14px;
	font-style: italic;
	font-weight: 600;
	line-height: 24px;
}

.cheval-competences__text > p {
	font-weight: 600;
	text-align: justify;
}

.cheval-competences .wp-block-image {
	margin: 0;
}

.cheval-competences img {
	display: block;
	width: 100%;
	height: auto;
}

/* — Notre équipe — */
.cheval-equipe {
	padding: 74px 0 32px var(--cheval-inset);
}

.cheval-equipe__intro {
	max-width: none;
}

.wp-block-group.cheval-team {
	gap: 40px 57px;
	margin-top: 56px;
	align-items: start;
}

.cheval-team > * {
	margin: 0;
}

.wp-block-group.cheval-member {
	min-width: 0;
}

.cheval-member .wp-block-image {
	margin: 0;
}

.cheval-member img {
	display: block;
	width: 100%;
	height: auto;
}

.cheval-member h3 {
	margin: 10px 0 0;
}

.cheval-member .cheval-rule {
	margin: 6px 0 10px;
}

.cheval-member .wp-block-list.cheval-diamonds {
	display: flex;
	flex-direction: column;
	gap: 9px;
	padding-left: 2px;
	font-size: 14px;
	line-height: 19px;
}

.cheval-member .cheval-diamonds li {
	gap: 4px;
}

.cheval-member .cheval-diamonds li::before {
	width: 4px;
	height: 4px;
	margin-right: 2px;
	background: var(--wp--preset--color--primary);
}

.cheval-member .cheval-member__domains {
	margin-top: 10px;
}

.cheval-member__domains strong {
	padding-left: 12px;
	color: var(--wp--preset--color--primary);
	font-weight: 700;
}

/* — Assistante juridique (bandeau bleu) — */
.wp-block-group.cheval-assistante {
	--cheval-rule-width: 330px;
	min-height: 289px;
	padding: 22px 26px 30px calc(33.33% + 13px);
}

.cheval-assistante > * {
	max-width: 330px;
}

.cheval-assistante .cheval-rule {
	margin: 6px 0 12px;
}

.cheval-assistante p {
	font-weight: 600;
}

.cheval-assistante strong {
	font-weight: 700;
}

@media (max-width: 980px) {
	.cheval-cabinet {
		padding: 50px var(--cheval-inset);
	}

	.cheval-equipe {
		padding: 50px var(--cheval-inset) 40px;
	}

	.wp-block-group.cheval-assistante {
		min-height: 0;
		padding: 24px 20px 36px;
	}
}

/* ==========================================================================
   5. Pied de page : bureaux, carte, canapé
   ========================================================================== */

.cheval-bureaux {
	padding: 146px 0 0;
}

.wp-block-group.cheval-bureaux__grid {
	gap: 24px 0;
	padding-left: var(--cheval-inset);
}

.wp-block-group.cheval-office {
	min-width: 0;
	padding: 2px 12px 6px;
	border-left: 2px solid var(--wp--preset--color--black);
	font-size: 14px;
	line-height: 20px;
}

.cheval-office > * {
	margin: 0;
}

.cheval-office h4 {
	margin: 0 0 6px;
	line-height: 1.3;
}

.cheval-office p {
	line-height: 20px;
}

.cheval-office .cheval-office__phone {
	margin-top: 14px;
}

.wp-block-group.cheval-office--legal {
	gap: 12px;
}

.cheval-office--legal a,
.cheval-office--legal p {
	color: var(--wp--preset--color--body);
}

.wp-block-group.cheval-map {
	height: 476px;
	margin-top: 28px;
	background: var(--wp--preset--color--stone);
}

.cheval-map iframe {
	display: block;
	width: 100%;
	height: 100%;
	border: 0;
}

.cheval-canape {
	display: flex;
	justify-content: center;
	padding-top: 60px;
}

.cheval-canape .wp-block-image {
	margin: 0;
}

.cheval-canape img {
	display: block;
	max-width: 100%;
	height: auto;
}

@media (max-width: 980px) {
	.cheval-bureaux {
		padding: 50px 0 0;
	}

	.wp-block-group.cheval-map {
		height: 320px;
	}
}

/* ==========================================================================
   6. Pages internes, articles, archives, recherche, 404
   ========================================================================== */

.cheval-page {
	max-width: 1080px;
	margin-inline: auto;
	padding: 74px var(--cheval-inset) 40px;
}

.cheval-page > * + * {
	margin-block-start: 24px;
}

.cheval-page .wp-block-post-title,
.cheval-page .wp-block-query-title {
	margin: 0;
}

.cheval-page .cheval-rule {
	margin: 4px 0 24px;
}

.cheval-page .wp-block-post-template {
	display: flex;
	flex-direction: column;
	gap: 40px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.cheval-page .wp-block-post-title a {
	color: inherit;
}

.cheval-page .wp-block-query-pagination {
	margin-top: 40px;
	gap: 16px;
}

@media (max-width: 980px) {
	.cheval-page {
		padding-top: 50px;
	}
}