/* ==========================================================================
   Locca - styles globaux (layout, typo, header, footer, sections, single team)
   ========================================================================== */

@font-face {
	font-family: "Libre Baskerville";
	font-style: normal;
	font-weight: 400;
	font-display: swap;
	src: url("../fonts/libre-baskerville-regular.woff2") format("woff2");
	unicode-range: U+0000-00FF, U+0131, U+2013-2014, U+2018-2019, U+201C-201D, U+2026, U+2212;
}

@font-face {
	font-family: "Libre Baskerville";
	font-style: normal;
	font-weight: 400;
	font-display: swap;
	src: url("../fonts/libre-baskerville-regular-ext.woff2") format("woff2");
	unicode-range: U+0100-02BA, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0;
}

:root {
	--locca-container: 1080px;
	--locca-container-large: 1280px;
	--locca-font: "Helvetica Neue", Helvetica, Arial, sans-serif;
	--locca-serif: "New Baskerville", "Libre Baskerville", "Times New Roman", serif;
}

body {
	font-family: var(--locca-font);
	font-size: clamp(15px, 1.15vw, 22px);
	line-height: 1.5;
	color: var(--locca-gris, #55584A);
	background: #fff;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

h1, h2, h3, h4, h5, h6 {
	font-family: var(--locca-font);
	color: var(--locca-encre, #1C1E14);
}

a {
	color: inherit;
}

.locca-container {
	max-width: var(--locca-container);
	margin: 0 auto;
	padding-left: 24px;
	padding-right: 24px;
}

/* --------------------------------------------------------------------------
   Header : logo en surimpression du hero
   -------------------------------------------------------------------------- */

.locca-header {
	position: absolute;
	top: 0;
	right: 0;
	z-index: 20;
	padding: clamp(14px, 2.03vw, 39px) clamp(16px, 3.8vw, 73px) 0 0;
}

.locca-logo {
	display: block;
	text-decoration: none;
}

.locca-logo__img {
	width: clamp(160px, 24.08vw, 462px);
	height: auto;
	display: block;
}

/* --------------------------------------------------------------------------
   Accueil : les blocs sont contraints à la colonne, le hero est full-bleed
   -------------------------------------------------------------------------- */

/* Trois niveaux d'alignement, valables pour tout bloc de premier niveau :
   normal = container, wide = container large, full = pleine largeur. */
.locca-home > *,
.entry-content > * {
	width: 90%;
	max-width: var(--locca-container);
	margin-left: auto;
	margin-right: auto;
}

.locca-home > .alignwide,
.entry-content > .alignwide {
	max-width: var(--locca-container-large);
}

.locca-home > .alignfull,
.entry-content > .alignfull {
	width: 100%;
	max-width: none;
}

.locca-home > * + *,
.entry-content > * + * {
	margin-top: clamp(3rem, 4.8vw, 5.75rem);
}

.locca-home > .locca-hero + * {
	margin-top: clamp(3.5rem, 4.8vw, 5.75rem);
}

.locca-home > *:last-child,
.entry-content > *:last-child {
	margin-bottom: clamp(3.5rem, 6vw, 7rem);
}

/* Pages texte (conditions, légal…) : entre blocs de TEXTE qui se suivent,
   rythme typographique normal, pas l'espacement de sections de la home. */
.entry-content > :where(p, ul, ol) + :where(p, ul, ol) {
	margin-top: 1em;
}

.entry-content > * + :where(h2, h3, h4) {
	margin-top: 2.25em;
}

.entry-content > :where(h2, h3, h4) + :where(p, ul, ol) {
	margin-top: 0.75em;
}

/* Corps de texte des pages légales (Conditions d'utilisation…) : un cran
   plus petit que la home. Spécificité (0,1,0) → passe devant la règle
   :where(.entry-content) > p partagée avec la home. */
.entry-content > :where(p, ul, ol) {
	font-size: clamp(14px, 0.94vw, 18px);
}

/* Blocs natifs : le design s'applique sans classe additionnelle.
   :where() garde une spécificité nulle pour que les réglages de l'éditeur
   (couleurs, tailles) gagnent toujours. */
:where(.locca-home, .entry-content) .wp-block-columns {
	gap: 2rem;
}

:where(.locca-home, .entry-content) h2,
:where(.locca-home, .entry-content) h3,
.entry-title,
.locca-titre-section {
	font-size: clamp(20px, 1.56vw, 30px);
	font-weight: 700;
	line-height: 1.1;
	color: var(--locca-ardoise, #85867F);
	margin-bottom: 0;
}

:where(.locca-home, .entry-content) .wp-block-column :where(h2, h3, .locca-titre-section) {
	margin-top: 0;
}

.locca-titre-section.has-vert-locca-color {
	line-height: 1;
}

:where(.locca-home, .entry-content) .wp-block-column p,
:where(.locca-home) > p,
:where(.entry-content) > p,
.locca-2col p {
	font-family: var(--locca-serif);
	/* serif à grand œil : 21px paraissent aussi grands que 26px d'Helvetica */
	font-size: clamp(15px, 1.09vw, 21px);
	line-height: 1.52;
	color: #707070;
	max-width: 34em;
	margin-top: 0;
}

hr.locca-croix {
	position: relative;
	width: clamp(56px, 6.3vw, 121px);
	height: clamp(56px, 6.3vw, 121px);
	margin-left: 39.33%;
	margin-right: auto;
	border: 0;
	background: none;
	opacity: 1;
}

hr.locca-croix::before,
hr.locca-croix::after {
	content: "";
	position: absolute;
	top: 50%;
	left: 0;
	width: 100%;
	height: clamp(1.5px, 0.156vw, 3px);
	background: var(--locca-vert, #C7D300);
}

hr.locca-croix::after {
	transform: rotate(90deg);
}

/* --------------------------------------------------------------------------
   Pages standard (Contact, etc.)
   -------------------------------------------------------------------------- */

.page .entry-header {
	width: 90%;
	max-width: var(--locca-container);
	margin: clamp(2.5rem, 5vw, 5rem) auto 0;
}

.page .entry-header .entry-title {
	margin: 0;
}

/* --------------------------------------------------------------------------
   Documents Complianz (politique de cookies, déclaration de confidentialité) :
   pleine largeur du container (comme le titre de page), même typo que les
   pages texte — pas de colonne de lecture réduite.
   Le plugin cible #cmplz-document (ID, 800px, 14px) → on préfixe par
   .entry-content pour passer devant sans !important.
   -------------------------------------------------------------------------- */

.entry-content > #cmplz-document {
	max-width: var(--locca-container);
	/* Complianz laisse parfois du texte brut directement dans le document
	   (ex. « Nous pouvons collecter… (cliquez pour déplier) ») → le conteneur
	   porte lui-même la typo de lecture ; les titres ont leur Helvetica explicite. */
	font-family: var(--locca-serif);
	font-size: clamp(14px, 0.94vw, 18px);
	line-height: 1.52;
	color: #707070;
	text-justify: auto;
}

.entry-content #cmplz-document p,
.entry-content #cmplz-document li,
.entry-content #cmplz-document td {
	font-family: var(--locca-serif);
	font-size: clamp(14px, 0.94vw, 18px);
	line-height: 1.52;
	color: #707070;
}

.entry-content #cmplz-document p {
	margin: 0 0 1em;
}

/* Bloc « Gérez vos réglages de consentement » : Complianz y injecte du texte
   brut (avis Do Not Track / GPC, ou les cases à cocher) sans <p> → on style
   le conteneur lui-même pour qu'il hérite de la typo Baskerville. */
.entry-content #cmplz-document .cmplz-manage-consent-container,
.entry-content #cmplz-document #cmplz-manage-consent-container-nojavascript {
	font-family: var(--locca-serif);
	font-size: clamp(14px, 0.94vw, 18px);
	line-height: 1.52;
	color: #707070;
	margin: 0 0 1em;
}

.entry-content #cmplz-document ul {
	margin: 0 0 1.5em 1.2em;
	padding: 0;
}

.entry-content #cmplz-document li {
	margin-bottom: 0.4em;
}

.entry-content #cmplz-document h2,
.entry-content #cmplz-document h3,
.entry-content #cmplz-document h4 {
	font-family: var(--locca-font);
	font-weight: 700;
	line-height: 1.1;
	color: var(--locca-ardoise, #85867F);
	padding: 0;
	border: 0;
}

.entry-content #cmplz-document h2 {
	font-size: clamp(20px, 1.56vw, 30px);
	margin: 2.25em 0 0.6em;
}

.entry-content #cmplz-document h3 {
	font-size: clamp(17px, 1.2vw, 23px);
	margin: 1.6em 0 0.5em;
}

.entry-content #cmplz-document h4 {
	font-size: clamp(15px, 1.09vw, 21px);
	margin: 1.2em 0 0.4em;
}

.entry-content #cmplz-document > :is(h2, h3):first-child {
	margin-top: 0;
}

.entry-content #cmplz-document a {
	color: var(--locca-vert, #C7D300);
	text-decoration: underline;
}

.entry-content #cmplz-document a[target="_blank"]::after {
	content: none;
}

/* Dépliants (services, catégories) : filet fin au lieu du fond gris */
.entry-content #cmplz-document .cmplz-dropdown {
	background: transparent;
	border-top: 1px solid #d9dcdc;
}

.entry-content #cmplz-document .cmplz-dropdown:last-of-type {
	border-bottom: 1px solid #d9dcdc;
}

.entry-content #cmplz-document .cmplz-dropdown summary {
	background: transparent;
	margin: 0;
	padding: 0.9em 0;
}

.entry-content #cmplz-document .cmplz-dropdown summary h3 {
	font-size: clamp(16px, 1.09vw, 21px);
	margin: 0;
	padding: 0;
}

.entry-content #cmplz-document .cmplz-dropdown summary p {
	font-family: var(--locca-font);
}

.entry-content #cmplz-document .cmplz-dropdown p,
.entry-content #cmplz-document .cmplz-dropdown a,
.entry-content #cmplz-document .cmplz-dropdown h4,
.entry-content #cmplz-document .cmplz-dropdown ul {
	padding-left: 0;
	padding-right: 0;
}

.entry-content #cmplz-document .cmplz-dropdown p {
	font-size: clamp(13px, 0.83vw, 16px);
}

/* Tableau des cookies (Nom / Expiration / Fonction) */
.entry-content #cmplz-document .cookies-per-purpose > :where(.name, .retention, .function) {
	font-family: var(--locca-serif);
	font-size: clamp(13px, 0.83vw, 16px);
	color: #707070;
}

/* --------------------------------------------------------------------------
   Footer : photo sombre, coordonnées, langues
   -------------------------------------------------------------------------- */

.locca-footer {
	position: relative;
	margin-top: clamp(4rem, 6vw, 7rem);
	aspect-ratio: 1920 / 842;
	padding-top: 10.68vw;
	background: #0b0a07 url("../img/locca-cour.jpg") center / cover no-repeat;
	color: #fff;
	font-size: clamp(15px, 1.09vw, 21px);
	font-weight: 300;
	line-height: 1.1;
}

.locca-footer::before {
	content: "";
	position: absolute;
	inset: 0;
	background: rgba(8, 7, 4, var(--locca-footer-voile, 0.85));
}

.locca-footer__inner {
	position: relative;
	display: grid;
	grid-template-columns: 24.2vw 36.3vw auto;
	align-items: start;
	gap: 0;
	padding-left: 10.68vw;
}

.locca-footer__lockup {
	width: 19.1vw;
	height: auto;
	display: block;
}

.locca-footer__coordonnees {
	font-style: normal;
	padding-top: 3.39vw;
}

.locca-footer__langues {
	padding-top: 3.39vw;
}

.locca-footer a {
	color: #fff;
	text-decoration: none;
	background-image: linear-gradient(currentColor, currentColor);
	background-repeat: no-repeat;
	background-position: 0 100%;
	background-size: 0 1px;
	transition: background-size 0.35s ease;
}

.locca-footer a:hover,
.locca-footer a:focus {
	background-size: 100% 1px;
}

.locca-footer__langues ul {
	display: flex;
	gap: 0.5em;
	margin: 0;
	padding: 0;
	list-style: none;
	text-transform: uppercase;
}

.locca-footer__langues li:not(:last-child)::after {
	content: "|";
	margin-left: 0.5em;
	opacity: 0.5;
}

.locca-footer__langues .current-lang a {
	font-weight: 700;
}

.locca-footer__langues li:not(.current-lang) a {
	opacity: 0.65;
}

a.locca-footer__map {
	display: inline-block;
	padding: 0.4em 0 0.9em;
	color: #fff;
	transition: color 0.3s ease;
}

.locca-footer__map svg {
	display: block;
	width: clamp(14px, 0.94vw, 18px);
	height: clamp(14px, 0.94vw, 18px);
}

a.locca-footer__map,
a.locca-footer__map:hover,
a.locca-footer__map:focus {
	background: none;
}

a.locca-footer__map:hover,
a.locca-footer__map:focus {
	color: var(--locca-vert, #C7D300);
}

.locca-footer__credits p {
	margin: 0;
}

.locca-footer__credits {
	position: absolute;
	right: clamp(16px, 2.34vw, 45px);
	bottom: clamp(12px, 1.3vw, 25px);
	margin: 0;
	font-size: clamp(11px, 0.68vw, 13px);
	opacity: 0.55;
	transition: opacity 0.3s ease;
}

.locca-footer__credits:hover {
	opacity: 1;
}

/* Liens légaux : même ligne et même corps que la signature, calés à gauche
   sur la colonne du logo (10,68 vw, cf. lockup). */
.locca-footer__legal {
	position: absolute;
	left: 10.68vw;
	bottom: clamp(12px, 1.3vw, 25px);
	display: flex;
	flex-wrap: wrap;
	gap: 0 1.2em;
	font-size: clamp(11px, 0.68vw, 13px);
	opacity: 0.75;
	transition: opacity 0.3s ease;
}

.locca-footer__legal:hover {
	opacity: 1;
}

.locca-footer__legal a,
.locca-footer__legal a:visited {
	color: inherit;
	text-decoration: none;
}

.locca-footer__legal a:hover,
.locca-footer__legal a:focus {
	color: var(--locca-vert, #C7D300);
}

@media (max-width: 782px) {
	.locca-footer {
		aspect-ratio: auto;
		padding: 3rem 24px;
	}

	.locca-footer__inner {
		grid-template-columns: 1fr;
		gap: 1.5rem;
		padding-left: 0;
	}

	.locca-footer__lockup {
		width: 160px;
	}

	/* alignés sur le texte de la tagline du logo (35,2 % de 160px) */
	.locca-footer__coordonnees,
	.locca-footer__langues {
		padding-top: 0;
		padding-left: 56px;
	}

	.locca-footer__credits {
		position: static;
		margin-top: 0.75rem;
		padding-left: 56px;
	}

	.locca-footer__legal {
		position: static;
		margin-top: 1.5rem;
		padding-left: 56px;
		gap: 0.25em 1em;
	}
}

/* --------------------------------------------------------------------------
   Single team
   -------------------------------------------------------------------------- */

.locca-hero-mini {
	height: clamp(180px, 23vw, 440px);
	overflow: hidden;
}

.locca-hero-mini img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

.page .site-main > article {
	margin-top: 3.5rem;
}

.locca-single-team .locca-team__membre--single {
	margin-top: 3.5rem;
}

.locca-single-team__bio {
	position: relative;
	background: var(--locca-sauge, #A6BABA);
	color: #fff;
	padding: clamp(1.5rem, 3.7vw, 4.45rem) clamp(1.25rem, 4vw, 4.8rem) clamp(5.5rem, 10.4vw, 12.5rem);
}

/* Sans CV : plus de « + » en bas à droite, on rend la place qui lui était réservée. */
.locca-single-team__bio--sans-cv {
	padding-bottom: clamp(1.5rem, 3.7vw, 4.45rem);
}

.locca-single-team__bio--sans-cv > :last-child {
	margin-bottom: 0;
}

.locca-single-team__bio p {
	font-size: clamp(16px, 1.37vw, 26px);
	line-height: 1.1;
	margin: 0 0 1em;
}

.locca-single-team__bio p:first-child {
	font-weight: 700;
}

.locca-plus {
	position: relative;
	display: block;
	width: 30px;
	height: 30px;
}

.locca-plus::before,
.locca-plus::after {
	content: "";
	position: absolute;
	top: 50%;
	left: 0;
	width: 100%;
	height: clamp(1.5px, 0.156vw, 3px);
	background: #fff;
	transition: transform 0.3s ease;
}

.locca-plus::after {
	transform: rotate(90deg);
}

.locca-plus:hover::before {
	transform: rotate(180deg);
}

.locca-plus:hover::after {
	transform: rotate(270deg);
}

.locca-single-team__cv {
	position: absolute;
	right: clamp(16px, 2.34vw, 45px);
	bottom: clamp(14px, 2.08vw, 40px);
	width: clamp(26px, 3.66vw, 70px);
	height: clamp(26px, 3.66vw, 70px);
}

.locca-single-team__retour {
	margin: 2.5rem 0 5rem;
}

/* Boutons : cadre fin vert, texte vert gras, fond transparent (maquette).
   Vaut pour le bloc Bouton de Gutenberg et le retour des fiches équipe. */
.wp-block-button__link,
.locca-retour {
	display: inline-block;
	padding: 0.6em 1.3em;
	border: clamp(1.5px, 0.156vw, 3px) solid var(--locca-vert, #C7D300);
	border-radius: 0;
	background: transparent;
	color: var(--locca-vert, #C7D300);
	font-weight: 700;
	font-size: clamp(15px, 1.09vw, 21px);
	line-height: 1;
	text-decoration: none;
	transition: background-color 0.3s ease, color 0.3s ease;
}

.wp-block-button__link:hover,
.wp-block-button__link:focus,
.locca-retour:hover,
.locca-retour:focus {
	background: var(--locca-vert, #C7D300);
	color: #fff;
}

.locca-team__photo:empty,
.locca-team__photo:not(:has(img)) {
	background: var(--locca-sauge, #9BACAB);
}
