:root {
	--csl-navy: #2c5093;
	--csl-navy-dark: #1f3a6e;
	--csl-blue: #00cce7;
	--csl-gray-bg: #e5e5e5;
	--csl-text: #223047;
	--csl-text-gray: #19073b;
	--csl-footer-top: #3986bf;
	--csl-footer-bottom: #2c5093;
	--container-width: 1200px;
	--font-main: 'Mulish', sans-serif;
}

* { box-sizing: border-box; }

html {
	scroll-behavior: smooth;
}

/* Décale la cible d'ancrage sous le header collant (ex : CTA "Je découvre" du hero). */
.section.intro {
	scroll-margin-top: 120px;
}

body {
	margin: 0;
	overflow-x: hidden;
	font-family: var(--font-main);
	font-weight: 300;
	font-size: 18px;
	color: var(--csl-text);
	line-height: 1.6;
}

strong, b { font-weight: 700; }
em, i { font-style: italic; }

h1, h2, h3 { font-weight: 900; }

img { max-width: 100%; display: block; }

a { text-decoration: none; color: inherit; }

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

.btn {
	display: inline-block;
	padding: 12px 28px;
	border-radius: 30px;
	font-weight: 600;
	font-size: 15px;
	transition: background-color 0.2s ease-out, color 0.2s ease-out, border-color 0.2s ease-out, transform 0.2s ease-out;
}

.btn:hover {
	transform: scale(1.06);
}

.btn--primary {
	background: var(--csl-navy);
	color: #fff;
}

.btn--primary:hover {
	background: var(--csl-navy-dark);
}

.btn--outline {
	background: transparent;
	color: var(--csl-navy);
	border: 2px solid var(--csl-navy);
	padding: 10px 26px;
}

.btn--outline:hover {
	background: var(--csl-navy);
	color: #fff;
}

.btn--light {
	background: var(--csl-blue);
	color: #fff;
}

.btn--light:hover {
	background: var(--csl-navy);
}

.btn--outline-white {
	background: transparent;
	color: #fff;
	border: 2px solid #fff;
	padding: 10px 26px;
}

.btn--outline-white:hover {
	background: #fff;
	color: var(--csl-navy);
}

/* Gutenberg button block styled as a CSL pill button */
.wp-block-button__link {
	transition: background-color 0.2s ease-out, color 0.2s ease-out, border-color 0.2s ease-out, transform 0.2s ease-out;
}

.wp-block-button__link:hover {
	transform: scale(1.06);
}

.wp-block-button.is-style-csl-pill .wp-block-button__link {
	background: var(--csl-navy);
	color: #fff;
	border-radius: 30px;
	padding: 12px 28px;
	font-weight: 600;
	font-size: 15px;
}

.wp-block-button.is-style-csl-pill .wp-block-button__link:hover {
	background: var(--csl-navy-dark);
}

/* Header */
.site-header {
	padding: 40px 0 20px;
	position: sticky;
	top: 0;
	z-index: 100;
	background: #fff;
	box-shadow: 0 4px 16px rgba(0,0,0,0.08);
}

.site-header__inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 24px;
}

.site-logo img {
	height: 56px;
}

.site-nav__list {
	display: flex;
	gap: 32px;
	list-style: none;
	margin: 0;
	padding: 0;
	flex: 1;
	justify-content: center;
}

.site-nav__list a {
	font-weight: 700;
	font-size: 15px;
	color: var(--csl-navy);
}

.site-nav__list li {
	position: relative;
}

.site-nav__list li.menu-item-has-children > a {
	display: inline-flex;
	align-items: center;
	gap: 6px;
}

.site-nav__list li.menu-item-has-children > a::after {
	content: '';
	width: 8px;
	height: 8px;
	border-right: 2px solid currentColor;
	border-bottom: 2px solid currentColor;
	transform: rotate(45deg);
	margin-top: -4px;
	transition: transform 0.2s ease;
}

.site-nav__list li.menu-item-has-children:hover > a::after,
.site-nav__list li.menu-item-has-children:focus-within > a::after {
	transform: rotate(-135deg);
	margin-top: 4px;
}

.site-nav__list ul {
	list-style: none;
	margin: 0;
	padding: 0;
	position: absolute;
	top: 100%;
	left: 0;
	min-width: 280px;
	background: #fff;
	box-shadow: 0 12px 24px rgba(0,0,0,0.12);
	opacity: 0;
	visibility: hidden;
	transform: translateY(8px);
	transition: opacity 0.15s ease, transform 0.15s ease;
	z-index: 20;
}

.site-nav__list li:hover > ul,
.site-nav__list li:focus-within > ul {
	opacity: 1;
	visibility: visible;
	transform: translateY(0);
}

.site-nav__list ul li {
	display: block;
}

.site-nav__list ul a {
	display: block;
	padding: 18px 24px;
	white-space: nowrap;
	font-weight: 700;
	color: var(--csl-navy);
	background: #fff;
}

.site-nav__list ul a:hover {
	background: var(--csl-navy);
	color: #fff;
}

.site-header__ctas {
	display: flex;
	align-items: center;
	gap: 12px;
	white-space: nowrap;
}

.site-header__ctas .btn {
	font-size: 14px;
	padding: 10px 20px;
}

.site-header__ctas .btn--outline {
	padding: 8px 18px;
}

.mobile-menu__ctas {
	display: flex;
	flex-direction: column;
	gap: 12px;
	margin-top: auto;
}

.mobile-menu__ctas .btn {
	text-align: center;
}

/* Hero */
.hero.alignfull {
	position: relative;
	width: 100vw;
	max-width: 100vw;
	margin-left: calc(50% - 50vw);
	margin-right: calc(50% - 50vw);
	min-height: 720px;
	display: flex;
	align-items: center;
	justify-content: center;
	overflow: hidden;
}

.hero.alignfull > .hero__slide {
	margin: 0 !important;
	max-width: none !important;
	position: absolute;
	inset: 0;
}

.hero__slide img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

/* Zoom continu sur la photo du héros (desktop uniquement) */
@media (min-width: 901px) {
	.hero__slide img {
		animation: csl-hero-zoom 12s ease-in-out infinite alternate;
	}
}

@keyframes csl-hero-zoom {
	from {
		transform: scale(1);
	}
	to {
		transform: scale(1.15);
	}
}

.hero__content {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	z-index: 1;
	text-align: center;
	width: 100%;
	padding: 0 24px;
}

.hero__title {
	color: #fff;
	font-size: 48px;
	margin: 0;
	text-shadow: 0 2px 10px rgba(0,0,0,0.55);
}

.hero__subtitle {
	color: #fff;
	font-weight: 600;
	font-size: 32px;
	margin: 8px 0 0;
	text-shadow: 0 1px 3px rgba(0,0,0,0.8), 0 2px 12px rgba(0,0,0,0.5);
}

@media (max-width: 560px) {
	.hero__title { font-size: 28px; }
	.hero__subtitle { font-size: 20px; }
}

/* Sections */
.section.alignfull {
	width: 100vw;
	max-width: 100vw;
	margin-left: calc(50% - 50vw);
	margin-right: calc(50% - 50vw);
}

.section {
	padding: 64px 0;
}

.section__title {
	text-align: center;
	color: var(--csl-navy);
	font-size: 40px;
	font-weight: 900;
	margin-bottom: 48px;
}

.section__title::before,
.section__title::after,
.dot-inline {
	content: '';
	display: inline-block;
	width: 10px;
	height: 10px;
	border-radius: 50%;
	background: var(--csl-blue);
	margin: 0 8px;
	vertical-align: middle;
}

/* Card grid (also matches Gutenberg's core Columns block) */
.card-grid.wp-block-columns {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 32px;
}

/* Page "Plongée Bouteille" : la grille "Les différentes disciplines" a 5
   cartes (pas 4 comme les autres reprises de ce motif ailleurs sur le
   site), donc 3 colonnes ici uniquement pour avoir 2 lignes équilibrées. */
.page-id-13 .card-grid.wp-block-columns {
	grid-template-columns: repeat(3, 1fr);
}

.card-grid.wp-block-columns > .wp-block-column {
	width: auto;
	flex-basis: auto;
	margin: 0;
}

.partners__grid.wp-block-columns {
	display: flex;
	align-items: center;
	gap: 32px;
}

.partners__grid.wp-block-columns > .wp-block-column {
	width: auto;
	flex-basis: 0;
	flex-grow: 1;
	min-width: 0;
	margin: 0;
}

.card-grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 32px;
}

.activities .card-grid.wp-block-columns,
.activities .card-grid {
	grid-template-columns: repeat(3, 1fr);
}

.card__image {
	width: 100%;
	aspect-ratio: 1;
	border-radius: 24px;
	overflow: hidden;
	margin-bottom: 20px;
}

.card__image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.card__image--placeholder {
	background: var(--csl-gray-bg);
}

.card__title {
	color: var(--csl-navy);
	font-size: 18px;
	font-weight: 900;
	margin: 0 0 12px;
}

.card__text {
	color: var(--csl-text-gray);
	font-size: 16px;
	margin: 0 0 20px;
}

/* Pool section */
.pool__inner {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 48px;
	align-items: center;
}

.pool__image img {
	border-radius: 24px;
	width: 100%;
}

.eyebrow {
	color: var(--csl-blue);
	font-weight: 700;
	font-size: 14px;
	line-height: 1.2;
	text-transform: uppercase;
	letter-spacing: 0.5px;
	margin: 0 0 4px;
}

.pool__content h2 {
	color: var(--csl-navy);
	font-size: 32px;
	margin: 8px 0 16px;
}

.pool__content p {
	color: var(--csl-text-gray);
	margin-bottom: 24px;
}

/* Values */
.section.values {
	padding-top: 24px;
}

.section.partners {
	padding-top: 24px;
}

.card-grid--values {
	text-align: left;
}

.value__icon {
	width: 100%;
	aspect-ratio: 1;
	border-radius: 24px;
	background: var(--csl-gray-bg);
	margin-bottom: 20px;
	position: relative;
	overflow: hidden;
}

.value__icon img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.value__title {
	color: var(--csl-navy);
	font-size: 18px;
	font-weight: 900;
	line-height: 1.2;
	margin: 0;
}

.value__title + .wp-block-heading {
	font-size: 18px;
	font-weight: 900;
	line-height: 1.2;
	margin: 0 0 12px;
}

.value__text {
	color: var(--csl-text-gray);
	font-size: 16px;
	margin: 0;
}

/* Partners */
.partners__grid {
	display: flex;
	align-items: center;
	gap: 32px;
}

.partners__grid > * {
	flex: 1;
	min-width: 0;
}

.partners__logo {
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: 90px;
}

.partners__logo:empty {
	background: var(--csl-gray-bg);
	border-radius: 12px;
	aspect-ratio: 2.2;
}

.partners__logo img {
	max-width: 130px;
	max-height: 90px;
	width: auto;
	height: auto;
	margin: 0 auto;
}

/* Bubble grid — decorative 3x3 dots ("bulles"), reusable across modules */
.bubble-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 14px;
	width: fit-content;
}

.bubble-grid span {
	width: 14px;
	height: 14px;
	border-radius: 50%;
	border: 2px solid currentColor;
	display: block;
}

.bubble-grid--white {
	color: #fff;
}

.bubble-grid--blue {
	color: var(--csl-blue);
}

.bubble-grid--corner {
	position: absolute;
	z-index: 1;
}

.bubble-grid--corner.bubble-grid--bottom-left {
	left: -24px;
	bottom: -24px;
}

.bubble-grid--corner.bubble-grid--middle-right {
	right: -24px;
	top: 50%;
	transform: translateY(-50%);
}

/* Outline button style ("Demandez") */
.wp-block-button.is-style-csl-outline .wp-block-button__link {
	background: transparent;
	color: var(--csl-navy);
	border: 2px solid var(--csl-navy);
	border-radius: 30px;
	padding: 10px 26px;
	font-weight: 600;
	font-size: 15px;
}

.wp-block-button.is-style-csl-outline .wp-block-button__link:hover {
	background: var(--csl-navy);
	color: #fff;
}

/* Pill plein, bleu clair */
.wp-block-button.is-style-csl-pill-light .wp-block-button__link {
	background: var(--csl-blue);
	color: #fff;
	border-radius: 30px;
	padding: 12px 28px;
	font-weight: 600;
	font-size: 15px;
}

.wp-block-button.is-style-csl-pill-light .wp-block-button__link:hover {
	background: var(--csl-navy);
}

/* Contour, bleu clair */
.wp-block-button.is-style-csl-outline-light .wp-block-button__link {
	background: transparent;
	color: var(--csl-blue);
	border: 2px solid var(--csl-blue);
	border-radius: 30px;
	padding: 10px 26px;
	font-weight: 600;
	font-size: 15px;
}

.wp-block-button.is-style-csl-outline-light .wp-block-button__link:hover {
	background: var(--csl-blue);
	color: #fff;
}

/* Pill plein, blanc (pour fonds foncés) */
.wp-block-button.is-style-csl-pill-white .wp-block-button__link {
	background: #fff;
	color: var(--csl-navy);
	border-radius: 30px;
	padding: 12px 28px;
	font-weight: 600;
	font-size: 15px;
}

.wp-block-button.is-style-csl-pill-white .wp-block-button__link:hover {
	background: var(--csl-blue);
	color: #fff;
}

/* Contour, blanc (pour fonds foncés) */
.wp-block-button.is-style-csl-outline-white .wp-block-button__link {
	background: transparent;
	color: #fff;
	border: 2px solid #fff;
	border-radius: 30px;
	padding: 10px 26px;
	font-weight: 600;
	font-size: 15px;
}

.wp-block-button.is-style-csl-outline-white .wp-block-button__link:hover {
	background: #fff;
	color: var(--csl-navy);
}

/* Page hero with overlaid title ("L'Apnée" style) */
.page-hero.alignfull {
	position: relative;
	width: 100vw;
	max-width: 100vw;
	margin-left: calc(50% - 50vw);
	margin-right: calc(50% - 50vw);
	min-height: 720px;
	display: flex;
	align-items: center;
	justify-content: center;
	overflow: hidden;
}

.page-hero.alignfull > .page-hero__bg {
	margin: 0 !important;
	max-width: none !important;
	position: absolute;
	inset: 0;
}

.page-hero__bg img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

/* Même zoom continu que le héros de la page d'accueil (desktop uniquement) */
@media (min-width: 901px) {
	.page-hero__bg img {
		animation: csl-hero-zoom 12s ease-in-out infinite alternate;
	}
}

/* Conteneur commun : titre, phrase d'accroche et CTA s'empilent naturellement
   à l'intérieur, ce qui évite tout chevauchement quel que soit le texte. Sur
   desktop, il démarre au premier tiers de la hauteur du hero. */
.page-hero__content {
	position: absolute;
	top: 30%;
	left: 50%;
	transform: translateX(-50%);
	width: 100%;
	z-index: 1;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 24px;
	padding: 0 24px;
}

.page-hero__row {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 64px;
	flex-wrap: nowrap;
}

/* Les bulles restent toujours de part et d'autre : c'est le titre, entre
   elles, qui s'enroule sur plusieurs lignes si besoin (au lieu de faire
   sauter une des bulles toute seule à la ligne — "flex-wrap: wrap" sur la
   ligne casse la ligne entière dès que le titre dépasse, "nowrap" + un
   titre qui peut rétrécir force le texte à s'enrouler sur lui-même à la
   place, en gardant les bulles fixes). */
.page-hero__row .bubble-grid {
	flex-shrink: 0;
}

.page-hero__row .page-hero__title {
	flex: 1 1 auto;
	min-width: 0;
	max-width: 100%;
}

.page-hero__ctas {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 20px;
	flex-wrap: wrap;
}

/* Sous 901px, le titre du hero peut passer sur 2 lignes : on abandonne le
   positionnement en pourcentage (risque de chevauchement) pour un simple
   empilement naturel, centré verticalement. */
@media (max-width: 900px) {
	.page-hero.alignfull {
		display: flex;
		align-items: center;
		justify-content: center;
	}

	.page-hero__content {
		position: relative;
		top: auto;
		left: auto;
		transform: none;
		gap: 20px;
	}
}

.page-hero__title {
	color: #fff;
	font-size: 48px;
	font-weight: 900;
	text-align: center;
	margin: 0;
	text-shadow: 0 2px 10px rgba(0,0,0,0.55);
}

.page-hero__subtitle {
	color: #fff;
	font-weight: 600;
	font-size: 26px;
	text-align: center;
	margin: 0;
	text-shadow: 0 1px 3px rgba(0,0,0,0.8), 0 2px 12px rgba(0,0,0,0.5);
}

/* Animations d'entrée du héros de page (desktop uniquement) — "lever" (montée + fondu) */
@media (min-width: 901px) {
	.page-hero__row .bubble-grid span,
	.page-hero__title .char {
		opacity: 0;
		transform: translateY(24px);
	}

	.page-hero__title .char {
		display: inline-block;
	}

	.page-hero__row.is-animated .bubble-grid span,
	.page-hero__title.is-animated .char {
		animation: csl-hero-rise 0.9s cubic-bezier(0.22, 1, 0.36, 1) forwards;
		animation-delay: var(--csl-delay, 0s);
	}

	@keyframes csl-hero-rise {
		to {
			opacity: 1;
			transform: translateY(0);
		}
	}
}

/* Animations au scroll (desktop uniquement) — même principe "lever" que le héros de page.
   La classe .has-scroll-reveal est ajoutée en JS : si le JS ne tourne pas, rien ne reste caché.
   Tous les blocs directs d'un ".container" apparaissent individuellement au scroll ;
   les grilles (cartes/partenaires) sont gérées à part pour un décalage carte par carte. */
@media (min-width: 901px) {
	.has-scroll-reveal .section .container > *:not(.card-grid):not(.partners__grid),
	.has-scroll-reveal .card-grid > .wp-block-column,
	.has-scroll-reveal .partners__grid > .wp-block-column,
	.has-scroll-reveal .txt-img__media,
	.has-scroll-reveal .txt-img__content {
		opacity: 0;
		transform: translateY(24px);
	}

	.has-scroll-reveal .section .container > *:not(.card-grid):not(.partners__grid).is-revealed,
	.has-scroll-reveal .card-grid.is-revealed > .wp-block-column,
	.has-scroll-reveal .partners__grid.is-revealed > .wp-block-column,
	.has-scroll-reveal .txt-img.is-revealed .txt-img__media,
	.has-scroll-reveal .txt-img.is-revealed .txt-img__content {
		animation: csl-hero-rise 0.9s cubic-bezier(0.22, 1, 0.36, 1) forwards;
		animation-delay: var(--csl-delay, 0s);
	}
}

/* Galerie 3 photos (à insérer au milieu d'un texte) */
.gallery-3.wp-block-gallery {
	display: flex;
	gap: 24px !important;
	margin: 40px 0;
}

.gallery-3.wp-block-gallery > .wp-block-image {
	flex: 1;
	margin: 0;
	position: relative;
	overflow: hidden;
	border-radius: 8px;
}

.gallery-3.wp-block-gallery > .wp-block-image.gallery-3__trigger {
	cursor: zoom-in;
}

/* Icône "agrandir" en coin, pour signaler que la photo s'ouvre en diaporama. */
.gallery-3.wp-block-gallery > .wp-block-image.gallery-3__trigger::after {
	content: '';
	position: absolute;
	top: 12px;
	right: 12px;
	width: 36px;
	height: 36px;
	border-radius: 50%;
	background-color: rgba(255, 255, 255, 0.9);
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%232c5093' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M8 3H5a2 2 0 0 0-2 2v3'/%3E%3Cpath d='M21 8V5a2 2 0 0 0-2-2h-3'/%3E%3Cpath d='M3 16v3a2 2 0 0 0 2 2h3'/%3E%3Cpath d='M16 21h3a2 2 0 0 0 2-2v-3'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: center;
	background-size: 18px 18px;
	pointer-events: none;
}

.gallery-3.wp-block-gallery > .wp-block-image img {
	width: 100%;
	height: 100%;
	aspect-ratio: 16 / 10;
	object-fit: cover;
	display: block;
}

.gallery-3.wp-block-gallery > .wp-block-image .wp-element-caption {
	position: absolute;
	bottom: 12px;
	right: 12px;
	left: 12px;
	display: flex;
	align-items: center;
	padding: 6px 10px;
	background: rgba(44, 80, 147, 0.85);
	color: #fff;
	font-size: 12px;
	text-decoration: underline;
	border-radius: 20px;
}

.gallery-3.wp-block-gallery > .wp-block-image .wp-element-caption::before {
	content: '©';
	flex-shrink: 0;
	text-decoration: none;
}

.gallery-3.wp-block-gallery > .wp-block-image .wp-element-caption:not(:empty)::before {
	margin-right: 6px;
}

@media (max-width: 640px) {
	.gallery-3.wp-block-gallery {
		flex-direction: column;
	}
}

/* Lightbox de la galerie 3 photos */
body.csl-lightbox-open {
	overflow: hidden;
}

.csl-lightbox {
	position: fixed;
	inset: 0;
	z-index: 1000;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	background: rgba(25, 7, 59, 0.92);
	opacity: 0;
	visibility: hidden;
	transition: opacity 0.25s ease, visibility 0.25s ease;
	padding: 24px;
}

.csl-lightbox.is-open {
	opacity: 1;
	visibility: visible;
}

.csl-lightbox__image {
	max-width: min(1100px, 90vw);
	max-height: 78vh;
	object-fit: contain;
	border-radius: 8px;
}

.csl-lightbox__caption {
	color: #fff;
	margin: 16px 0 0;
	font-size: 14px;
	opacity: 0.85;
}

.csl-lightbox__counter {
	position: absolute;
	top: 24px;
	left: 24px;
	color: #fff;
	font-size: 14px;
	opacity: 0.7;
}

.csl-lightbox__close,
.csl-lightbox__prev,
.csl-lightbox__next {
	position: absolute;
	width: 52px;
	height: 52px;
	display: flex;
	align-items: center;
	justify-content: center;
	background: rgba(255, 255, 255, 0.9);
	border: none;
	border-radius: 50%;
	color: var(--csl-navy);
	font-size: 26px;
	line-height: 1;
	cursor: pointer;
	transition: background 0.2s ease, color 0.2s ease;
}

.csl-lightbox__close:hover,
.csl-lightbox__prev:hover,
.csl-lightbox__next:hover {
	background: var(--csl-blue);
	color: #fff;
}

.csl-lightbox__close {
	top: 24px;
	right: 24px;
}

.csl-lightbox__prev {
	left: 24px;
	top: 50%;
	transform: translateY(-50%);
}

.csl-lightbox__next {
	right: 24px;
	top: 50%;
	transform: translateY(-50%);
}

@media (max-width: 640px) {
	.csl-lightbox__prev,
	.csl-lightbox__next {
		width: 36px;
		height: 36px;
		font-size: 18px;
	}

	.csl-lightbox__prev {
		left: 8px;
	}

	.csl-lightbox__next {
		right: 8px;
	}
}

/* Intro + anchor CTAs */
.intro {
	text-align: center;
	padding-top: 32px;
}

.intro__text {
	max-width: 760px;
	margin: 0 auto 32px;
	color: var(--csl-blue);
}

.intro__ctas {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 16px;
}

.intro__ctas .wp-block-button .wp-block-button__link {
	background: transparent;
	color: var(--csl-blue);
	border: 2px solid var(--csl-blue);
	border-radius: 30px;
	padding: 10px 22px;
	font-weight: 600;
	font-size: 14px;
}

/* Accès rapide */
.quick-access.alignfull {
	width: 100vw;
	max-width: 100vw;
	margin-left: calc(50% - 50vw);
	margin-right: calc(50% - 50vw);
	padding: 0;
}

.quick-access__inner {
	position: relative;
	background: linear-gradient(120deg, var(--csl-blue), var(--csl-navy-dark));
	border-radius: 24px;
	padding: 56px 40px;
}

.quick-access__label {
	position: absolute;
	top: -18px;
	left: 50%;
	transform: translateX(-50%);
	background: #10182b;
	color: #fff;
	font-weight: 700;
	font-size: 14px;
	padding: 8px 24px;
	border-radius: 30px;
	white-space: nowrap;
}

.quick-access__grid.wp-block-columns {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 32px;
}

.quick-access__grid.wp-block-columns > .wp-block-column {
	width: auto;
	flex-basis: auto;
	margin: 0;
}

.quick-access__item {
	text-align: center;
	color: #fff;
}

.quick-access__item p {
	margin: 0;
}

.quick-access__icon {
	width: 140px;
	margin: 0 auto 20px;
}

.quick-access__icon img {
	width: 100%;
	height: auto;
}

.quick-access__item a {
	color: #fff !important;
	font-weight: 700;
	font-size: 20px;
	text-decoration: none !important;
}

/* Texte / image alterné */
.txt-img {
	display: flex;
	align-items: center;
	gap: 64px;
	max-width: var(--container-width);
	margin: 0 auto 80px;
	padding: 0 24px;
}

.txt-img--reverse {
	flex-direction: row-reverse;
}

.txt-img--reverse .txt-img__content {
	text-align: right;
}

.txt-img--reverse .txt-img__content .dots-row {
	justify-content: flex-end;
}

.txt-img--reverse .txt-img__content .wp-block-buttons {
	justify-content: flex-end;
}

.txt-img__media {
	position: relative;
	flex: 1;
}

.txt-img__media .wp-block-group,
.txt-img__media img {
	width: 100%;
	aspect-ratio: 4 / 3;
	border-radius: 24px;
	object-fit: cover;
	background: var(--csl-gray-bg);
}

.txt-img__content {
	flex: 1;
}

.dots-row {
	display: flex;
	gap: 6px;
	margin: 8px 0 16px;
}

.dots-row span {
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: var(--csl-blue);
	display: block;
}

.txt-img__content h3 {
	color: var(--csl-navy);
	font-size: 30px;
	font-weight: 900;
	margin: 0;
}

.txt-img__content p {
	color: var(--csl-text-gray);
	margin: 16px 0 24px;
}

/* Chiffres clés */
.stats__grid.wp-block-columns {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 32px;
}

.stats__grid.wp-block-columns > .wp-block-column {
	width: auto;
	flex-basis: auto;
	margin: 0;
	text-align: center;
}

.stats__circle {
	width: 110px;
	height: 110px;
	margin: 0 auto 16px;
	border: 2px solid var(--csl-navy);
	border-radius: 50%;
}

.stats__label {
	color: var(--csl-navy);
	font-weight: 700;
}

/* Standard pages (title + content), e.g. Contact */
.page-content {
	padding: 48px 0 80px;
}

.page-content__eyebrow {
	text-align: center;
	color: var(--csl-text-gray);
	font-size: 18px;
	font-weight: 400;
	margin: 0 0 8px;
}

/* Liste de tarifs (lignes libellé + prix alignées) */
.pricing-list {
	max-width: 760px;
	margin: 32px auto;
}

.pricing-list__group-title {
	color: var(--csl-navy);
	font-size: 20px;
	font-weight: 700;
	margin: 32px 0 4px;
}

.pricing-list__group-title:first-child {
	margin-top: 0;
}

.pricing-row {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: baseline;
	gap: 8px 24px;
	padding: 14px 0;
	border-bottom: 1px solid var(--csl-gray-bg);
}

.pricing-row__label {
	color: var(--csl-text);
	margin: 0;
}

.pricing-row__price {
	color: var(--csl-navy);
	font-weight: 700;
	font-size: 18px;
	white-space: nowrap;
	margin: 0;
}

.pricing-list__note {
	color: var(--csl-text-gray);
	font-size: 15px;
	margin: 16px 0 0;
}

.page-content .wp-block-fluentform,
.page-content .fluentform {
	max-width: 640px;
	margin: 0 auto;
}

.page-content > .wp-block-heading,
.page-content > p,
.page-content > ul,
.page-content > ol,
.page-content > blockquote,
.page-content > .wp-block-table,
.page-content > .wp-block-quote,
.page-content > .wp-block-buttons {
	max-width: 760px;
	margin-left: auto;
	margin-right: auto;
}

/* Pastilles de couleur pour repérer une activité en un coup d'œil dans les tableaux d'horaires */
.activity-legend {
	display: flex;
	flex-wrap: wrap;
	gap: 8px 20px;
	margin: 0 0 24px;
	font-size: 14px;
	color: var(--csl-text-gray);
}

.activity-dot {
	display: inline-block;
	width: 10px;
	height: 10px;
	border-radius: 3px;
	margin-right: 6px;
	vertical-align: middle;
}

.activity-dot--plongee { background: var(--csl-blue); }
.activity-dot--apnee { background: #34c77a; }
.activity-dot--nap { background: #f4c542; }
.activity-dot--enfants { background: #f2994a; }
.activity-dot--handisub { background: #9b59b6; }

/* Wave divider above the footer */
.wave-divider {
	position: relative;
	width: 100vw;
	max-width: 100vw;
	margin-left: calc(50% - 50vw);
	margin-right: calc(50% - 50vw);
	line-height: 0;
	overflow: hidden;
}

.wave-divider svg {
	display: block;
	width: 100%;
	height: 140px;
}

.wave-divider__layer--1 { fill: var(--csl-gray-bg); opacity: 0.6; }
.wave-divider__layer--2 { fill: var(--csl-blue); opacity: 0.45; }
.wave-divider__layer--3 { fill: var(--csl-navy); opacity: 0.55; }
.wave-divider__layer--4 { fill: var(--csl-footer-top); }

@media (max-width: 560px) {
	.wave-divider svg { height: 80px; }
}

/* Footer */
.site-footer {
	background: linear-gradient(180deg, var(--csl-footer-top), var(--csl-footer-bottom));
	color: #fff;
	padding: 64px 0 0;
}

.site-footer__grid {
	display: grid;
	grid-template-columns: 1.6fr 1fr 1fr 1.2fr;
	gap: 40px;
	align-items: start;
	padding-bottom: 40px;
}

.site-footer__brand img {
	height: 56px;
	margin-bottom: 16px;
}

.site-footer__brand p {
	margin: 0;
	font-size: 14px;
	line-height: 1.6;
	color: rgba(255,255,255,0.8);
}

.site-footer__col h4 {
	margin: 0 0 16px;
	font-size: 16px;
}

.site-footer__links {
	list-style: none;
	margin: 0;
	padding: 0;
}

.site-footer__links li {
	margin-bottom: 10px;
}

.site-footer__links a {
	font-size: 14px;
	color: rgba(255,255,255,0.85);
}

.site-footer__links a:hover {
	color: #fff;
}

.site-footer__contact-item {
	display: flex;
	align-items: center;
	gap: 12px;
	margin-bottom: 14px;
}

.site-footer__contact-item p {
	margin: 0;
	font-size: 14px;
	color: rgba(255,255,255,0.85);
}

.site-footer__icon {
	flex: none;
	width: 32px;
	height: 32px;
	border-radius: 50%;
	border: 1px solid rgba(255,255,255,0.5);
	display: flex;
	align-items: center;
	justify-content: center;
}

.site-footer__icon svg {
	width: 16px;
	height: 16px;
	stroke: #fff;
	fill: none;
}

.site-footer__legal {
	display: flex;
	justify-content: space-between;
	align-items: center;
	flex-wrap: wrap;
	gap: 12px;
	padding: 20px 24px;
	border-top: 1px solid rgba(255,255,255,0.2);
}

.site-footer__legal p {
	margin: 0;
	font-size: 13px;
	color: rgba(255,255,255,0.7);
}

.site-footer__legal-links {
	display: flex;
	gap: 24px;
}

.site-footer__legal-links a {
	font-size: 13px;
	color: rgba(255,255,255,0.7);
}

.site-footer__legal-links a:hover {
	color: #fff;
}

/* Responsive */
@media (max-width: 1100px) {
	.card-grid,
	.card-grid.wp-block-columns,
	.activities .card-grid.wp-block-columns,
	.activities .card-grid {
		grid-template-columns: repeat(2, 1fr);
	}
}

@media (max-width: 900px) {
	.pool__inner { grid-template-columns: 1fr; }
	.site-footer__grid { grid-template-columns: 1fr 1fr; }
	.partners__grid,
	.partners__grid.wp-block-columns {
		flex-wrap: wrap;
	}
	.partners__grid > *,
	.partners__grid.wp-block-columns > .wp-block-column {
		flex: 1 1 40%;
	}
	.quick-access__grid.wp-block-columns { grid-template-columns: repeat(2, 1fr); }
	.stats__grid.wp-block-columns { grid-template-columns: repeat(2, 1fr); }
	.txt-img,
	.txt-img--reverse { flex-direction: column; }
	.page-hero__row { gap: 24px; }
	.bubble-grid--corner { display: none; }
}

@media (max-width: 560px) {
	.card-grid,
	.card-grid.wp-block-columns,
	.activities .card-grid.wp-block-columns,
	.activities .card-grid {
		grid-template-columns: 1fr;
	}
	.site-footer__inner { grid-template-columns: 1fr; }
	.quick-access__grid.wp-block-columns { grid-template-columns: 1fr; }
	.stats__grid.wp-block-columns { grid-template-columns: 1fr; }
	.page-hero__title { font-size: 32px; }
}

/* FAQ (bloc natif Yoast FAQ, stylisé en accordéon) */
.schema-faq {
	max-width: 800px;
	margin: 0 auto;
	padding: 0 24px;
}

.section.faq {
	padding-bottom: 0;
}

.section.faq .section__title {
	margin-bottom: 12px;
}

.schema-faq-section {
	position: relative;
	border-bottom: 1px solid var(--csl-gray-bg);
	padding: 20px 48px 20px 0;
	cursor: pointer;
	user-select: none;
}

.schema-faq-question {
	margin: 0;
	font-size: 20px;
	font-weight: 700;
	color: var(--csl-navy);
}

.schema-faq-answer {
	display: none;
	color: var(--csl-text-gray);
	margin: 0;
	padding-top: 2px;
}

.schema-faq-answer p {
	margin: 0;
}

.schema-faq-section.deploy .schema-faq-answer {
	display: block;
}

/* Toujours visible dans l'éditeur de blocs (l'accordéon repliable n'est qu'un comportement du site publié) */
.editor-styles-wrapper .schema-faq-answer {
	display: block;
}

.schema-faq-section::after {
	content: '';
	position: absolute;
	top: 24px;
	right: 4px;
	width: 14px;
	height: 14px;
	border-right: 2px solid var(--csl-blue);
	border-bottom: 2px solid var(--csl-blue);
	transform: rotate(45deg);
	transition: transform 0.25s ease;
}

.schema-faq-section.deploy::after {
	transform: rotate(-135deg);
	top: 30px;
}

/* Contact page */
.section.contact {
	padding-top: 24px;
}

.contact-grid {
	display: grid;
	grid-template-columns: 1.4fr 1fr;
	gap: 64px;
	align-items: start;
}

.contact-grid > .contact-form,
.contact-grid > .contact-info {
	width: 100%;
	max-width: none;
	box-sizing: border-box;
}

.contact-form .fluentform {
	max-width: 100%;
}

.contact-form h3,
.contact-info h3 {
	color: var(--csl-navy);
	margin-bottom: 24px;
}

.contact-info__item {
	display: flex;
	align-items: center;
	gap: 16px;
	margin-bottom: 20px;
}

.contact-info__item p {
	margin: 0;
	color: var(--csl-text-gray);
}

.contact-info__icon {
	flex: none;
	width: 44px;
	height: 44px;
	border-radius: 50%;
	border: 2px solid var(--csl-blue);
	display: flex;
	align-items: center;
	justify-content: center;
}

.contact-info__icon svg {
	width: 20px;
	height: 20px;
	stroke: var(--csl-blue);
	fill: none;
}

.contact-social {
	display: flex;
	gap: 12px;
	margin-top: 12px;
}

.contact-social a {
	width: 40px;
	height: 40px;
	border-radius: 50%;
	background: var(--csl-navy);
	display: flex;
	align-items: center;
	justify-content: center;
}

.contact-social svg {
	width: 18px;
	height: 18px;
	fill: #fff;
	stroke: none;
}

@media (max-width: 900px) {
	.contact-grid { grid-template-columns: 1fr; }
}

.map-embed {
	border-radius: 24px;
	overflow: hidden;
	line-height: 0;
}

.map-embed iframe {
	display: block;
}

/* Pastilles infos */
.section.info-pills {
	padding: 24px 0 48px;
}

.info-pills__grid.wp-block-columns {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 32px;
	margin-left: 60px !important;
	margin-right: 60px !important;
}

.info-pills__grid.wp-block-columns > .wp-block-column {
	width: auto;
	flex-basis: auto;
	margin: 0;
}

.info-pill {
	position: relative;
	border: 2px solid var(--csl-navy);
	border-radius: 40px;
	padding: 28px 24px 24px;
	text-align: center;
}

.info-pill__icon {
	position: absolute;
	top: -20px;
	left: 50%;
	transform: translateX(-50%);
	background: #fff;
	padding: 0 10px;
	display: flex;
	align-items: center;
	justify-content: center;
}

.info-pill__icon img {
	height: 40px;
	width: auto;
}

.info-pill p {
	margin: 0;
	color: var(--csl-text-gray);
	line-height: 1.5;
}

.info-pill p strong {
	color: var(--csl-navy);
}

@media (max-width: 900px) {
	.info-pills__grid.wp-block-columns { grid-template-columns: 1fr; margin-left: 0 !important; margin-right: 0 !important; }
}

/* Ce bloc "Colonnes" a été inséré sans le conteneur standard du site :
   on lui applique le même gabarit que ".container" (largeur max 1200px,
   centré, 24px de marge de chaque côté) pour qu'il s'aligne comme le
   reste des sections de la page (ex : "Les valeurs du Club"). */
.decouvrir-approfondir-partager {
	max-width: var(--container-width) !important;
	margin-left: auto !important;
	margin-right: auto !important;
	padding-left: 24px !important;
	padding-right: 24px !important;
	box-sizing: border-box !important;
}

/* Bloc dégradé (photo + texte + CTA) */
.gradient-block {
	position: relative;
	background: var(--csl-blue);
	border-radius: 40px;
	padding: 48px 48px 48px calc(38% + 40px);
	min-height: 300px;
	color: #fff;
	max-width: var(--container-width);
	margin: 60px auto 0;
}

.gradient-block__media {
	position: absolute;
	top: -32px;
	left: -32px;
	width: 38%;
	aspect-ratio: 4 / 3;
	z-index: 2;
}

.gradient-block__media figure {
	margin: 0;
	width: 100%;
	height: 100%;
}

.gradient-block__media img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	border-radius: 24px;
	box-shadow: 0 24px 40px rgba(15, 40, 70, 0.22);
	display: block;
}

.gradient-block__media .bubble-grid {
	position: absolute;
	top: 50%;
	right: -52px;
	transform: translateY(-50%);
	z-index: 3;
}

.gradient-block__content {
	max-width: 480px;
}

.gradient-block__eyebrow {
	color: #fff;
	font-size: 16px;
	font-weight: 700;
	margin: 0;
}

.gradient-block__title {
	color: var(--csl-navy);
	font-size: 36px;
	margin: 8px 0 16px;
}

.gradient-block__text {
	color: rgba(255,255,255,0.9);
	margin: 0 0 24px;
}

.gradient-block__ctas {
	display: flex;
	gap: 16px;
}

@media (max-width: 900px) {
	.gradient-block {
		display: flex;
		flex-direction: column;
		gap: 24px;
		padding: 24px;
		margin-top: 32px;
	}

	.gradient-block__media {
		position: static;
		width: 100%;
		aspect-ratio: 4 / 3;
	}

	.gradient-block__media img {
		box-shadow: none;
	}

	.gradient-block__media .bubble-grid {
		display: none;
	}

	.gradient-block__content {
		max-width: none;
	}
}

/* Hamburger trigger */
.menu-toggle {
	display: none;
	flex-direction: column;
	justify-content: center;
	gap: 5px;
	width: 44px;
	height: 44px;
	background: none;
	border: none;
	cursor: pointer;
	padding: 0;
}

.menu-toggle span {
	display: block;
	width: 26px;
	height: 3px;
	border-radius: 2px;
	background: var(--csl-navy);
}

/* Mobile full-screen menu */
.mobile-menu {
	position: fixed;
	inset: 0;
	z-index: 200;
	background: #fff;
	display: flex;
	flex-direction: column;
	padding: 20px 24px 40px;
	overflow-y: auto;
	opacity: 0;
	visibility: hidden;
	transform: translateY(-12px);
	transition: opacity 0.25s ease, transform 0.25s ease, visibility 0.25s;
}

.mobile-menu.is-open {
	opacity: 1;
	visibility: visible;
	transform: translateY(0);
}

.mobile-menu__top {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-bottom: 40px;
}

.mobile-menu__top .site-logo img {
	height: 48px;
}

.menu-close {
	width: 44px;
	height: 44px;
	background: none;
	border: none;
	font-size: 32px;
	line-height: 1;
	color: var(--csl-navy);
	cursor: pointer;
}

.mobile-menu__list {
	list-style: none;
	margin: 0 0 40px;
	padding: 0;
}

.mobile-menu__list a {
	display: block;
	padding: 18px 0;
	font-size: 22px;
	font-weight: 700;
	color: var(--csl-navy);
}

.mobile-menu__list li.has-toggle {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 12px;
}

.mobile-menu__list li.has-toggle > a {
	flex: 1;
	order: 1;
}

.mobile-menu__toggle {
	order: 2;
	flex: none;
	width: 24px;
	height: 24px;
	margin: 0;
	background: none;
	border: none;
	padding: 0;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
}

.mobile-menu__toggle::before {
	content: '';
	width: 9px;
	height: 9px;
	border-right: 2px solid var(--csl-navy);
	border-bottom: 2px solid var(--csl-navy);
	transform: rotate(45deg);
	margin-top: -3px;
	transition: transform 0.2s ease;
}

.mobile-menu__list li.has-toggle.is-expanded .mobile-menu__toggle::before {
	transform: rotate(-135deg);
	margin-top: 3px;
}

.mobile-menu__list li.has-toggle > ul {
	order: 3;
	width: 100%;
	max-height: 0;
	overflow: hidden;
	transition: max-height 0.3s ease;
}

.mobile-menu__list li.has-toggle.is-expanded > ul {
	max-height: 400px;
}

.mobile-menu__list ul {
	list-style: none;
	margin: 0 0 12px;
	padding: 0 0 0 36px;
}

.mobile-menu__list ul a {
	padding: 12px 0;
	font-size: 17px;
	font-weight: 600;
	color: var(--csl-text-gray);
}

body.mobile-menu-open {
	overflow: hidden;
}

@media (max-width: 900px) {
	.site-nav {
		display: none;
	}

	.site-header__ctas {
		gap: 8px;
	}

	.site-header__ctas .btn {
		padding: 8px 14px;
		font-size: 13px;
	}

	.menu-toggle {
		display: flex;
	}

	.site-header__inner {
		flex-wrap: nowrap;
	}
}

@media (max-width: 420px) {
	.site-header__ctas .btn--outline {
		display: none;
	}
}

@media (min-width: 901px) {
	.mobile-menu {
		display: none;
	}
}

/* Tuiles activités (3 colonnes x 2 lignes, hover) */
.activity-tiles.wp-block-columns {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 24px;
}

.activity-tiles.wp-block-columns > .wp-block-column {
	width: auto;
	flex-basis: auto;
	margin: 0;
}

.activity-tile {
	position: relative;
	aspect-ratio: 1;
	border-radius: 16px;
	overflow: hidden;
	cursor: pointer;
}

.activity-tile__image {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	margin: 0;
}

.activity-tile__image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

.activity-tile__image--placeholder {
	background: var(--csl-gray-bg);
}

.activity-tile__default {
	position: absolute;
	inset: 0;
	z-index: 1;
	display: flex;
	align-items: center;
	justify-content: center;
	text-align: center;
	padding: 24px;
}

.activity-tile__title {
	color: #fff;
	font-size: 28px;
	margin: 0;
	text-shadow: 0 3px 20px rgba(0,0,0,0.6);
}

.activity-tile__hover {
	position: absolute;
	inset: 0;
	z-index: 2;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	text-align: center;
	padding: 24px;
	opacity: 0;
	transition: opacity 0.3s ease-in-out;
}

.activity-tile__hover::before {
	content: '';
	position: absolute;
	inset: 0;
	background: #19073b;
	opacity: 0.85;
	z-index: -1;
}

.activity-tile:hover .activity-tile__hover,
.activity-tile:focus-visible .activity-tile__hover {
	opacity: 1;
}

.activity-tile__tagline {
	color: #fff;
	font-weight: 700;
	font-size: 17px;
	margin: 0 0 16px;
}

.activity-tile__cta .wp-block-button__link {
	position: relative;
}

.activity-tile__cta .wp-block-button__link::after {
	content: '';
	position: absolute;
	inset: 0;
}

@media (max-width: 900px) {
	.activity-tiles.wp-block-columns {
		grid-template-columns: repeat(2, 1fr);
	}
}

@media (max-width: 640px) {
	.activity-tiles.wp-block-columns {
		grid-template-columns: 1fr;
		gap: 16px;
	}

	.activity-tile {
		aspect-ratio: 21 / 9;
	}

	.activity-tile__title {
		font-size: 22px;
	}
}

/* Intégration The Events Calendar (agenda) — reteinte via les variables CSS du plugin */
body .tribe-common {
	--tec-color-accent-primary: var(--csl-blue);
	--tec-color-accent-primary-hover: var(--csl-navy);
	--tec-color-accent-primary-active: var(--csl-navy);
	--tec-color-link-accent: var(--csl-blue);
	--tec-color-link-accent-hover: var(--csl-navy);
	--tec-color-button-primary-active: var(--csl-navy);
	--tec-color-background-events-bar-submit-button-active: var(--csl-navy);
	--tec-color-accent-secondary: var(--csl-navy);
	--tec-color-accent-secondary-hover: var(--csl-navy-dark);
	--tec-color-accent-secondary-active: var(--csl-navy-dark);
	--tec-color-border-active: var(--csl-navy);
	--tec-color-icon-active: var(--csl-navy);
	--tec-color-icon-events-bar-active: var(--csl-navy);
	--tec-color-day-marker-current-month-active: var(--csl-blue);
	--tec-color-day-marker-past-month-active: var(--csl-navy);
	--tec-outline-active-default: 2px solid var(--csl-navy);
	--tec-color-border-active-month-grid-hover: var(--csl-navy);
}

.tribe-common-c-btn,
.tribe-events-c-search__button {
	border-radius: 30px !important;
	font-weight: 600 !important;
}

.tribe-events-c-search__button {
	background-color: var(--csl-blue) !important;
	border-color: var(--csl-blue) !important;
	color: #fff !important;
}

.tribe-events-c-subscribe-dropdown__button,
.tribe-events-c-top-bar__today-button {
	border-color: var(--csl-navy) !important;
	color: var(--csl-navy) !important;
}

.tribe-events-c-view-selector__button[aria-current="true"],
.tribe-events-c-nav__prev:not([disabled]),
.tribe-events-c-nav__next:not([disabled]),
.tribe-events-calendar-list__event-title a {
	color: var(--csl-navy) !important;
}

/* Fiche évènement (page simple) : typo et photo alignées sur le reste du site */
.tribe-events-single,
.tribe-events-single * {
	font-family: var(--font-main) !important;
}

.tribe-events-single-event-title,
.tribe-events-single-section-title {
	color: var(--csl-navy) !important;
}

.tribe-events-event-image img {
	border-radius: 16px;
}

/* La ligne brute "Site : url" est masquée, remplacée par le bouton .csl-event-cta */
li:has(> .tribe-events-event-url-label),
li:has(> .tribe-events-event-url) {
	display: none;
}

.csl-event-cta {
	display: block;
	margin-top: 16px;
}

.csl-event-cta .btn {
	display: inline-block;
}

.tribe-events-single-event-description a,
.tribe-events-schedule a {
	color: var(--csl-blue) !important;
}

/* Liste des évènements (surcharge tribe/events/v2/list/event.php) */
.csl-events-list__event-row {
	padding: 32px 0;
	border-bottom: 1px solid var(--csl-gray-bg);
}

.csl-events-list__event-row:first-child {
	padding-top: 0;
}

.csl-events-list__event-row .tribe-events-calendar-list__event {
	display: flex !important;
	align-items: flex-start;
	gap: 32px;
}

.csl-events-list__main {
	display: flex;
	gap: 20px;
	flex: 1;
	min-width: 0;
}

.csl-events-list__date-badge {
	flex: none;
	display: flex !important;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	width: 84px;
	height: 84px;
	border: 2px solid var(--csl-navy) !important;
	border-radius: 12px;
	text-align: center;
	line-height: 1.2;
}

.csl-events-list__date-badge-day,
.csl-events-list__date-badge-month {
	color: var(--csl-navy);
	font-size: 13px;
	font-weight: 700;
	text-transform: capitalize;
}

.csl-events-list__date-badge-num {
	color: var(--csl-navy);
	font-size: 22px;
	font-weight: 900;
}

.csl-events-list__details {
	flex: 1;
	min-width: 0;
}

.csl-events-list__title {
	margin: 4px 0 8px;
	font-size: 24px;
}

.csl-events-list__title a,
.csl-events-list__title a:visited,
.csl-events-list__title a:hover,
.csl-events-list__title a:focus {
	color: var(--csl-navy);
	font-weight: 900;
	text-decoration: none;
}

.csl-events-list__venue {
	display: inline-flex !important;
	align-items: center;
	gap: 6px;
	color: var(--csl-blue) !important;
	font-weight: 700;
	margin: 0 0 12px;
}

.csl-events-list__venue svg {
	width: 16px;
	height: 16px;
	stroke: var(--csl-blue);
	fill: none;
}

.csl-events-list__description {
	color: var(--csl-text);
	margin: 0 0 16px;
}

.csl-events-list__description p {
	margin: 0;
}

/* Le reset CSS du plugin (.tribe-common a { border:0; padding:0; }) est plus
   spécifique que .btn--outline seul : on force les valeurs ici. */
.csl-events-list__view {
	display: inline-block !important;
	margin-top: 16px !important;
	border: 2px solid var(--csl-navy) !important;
	border-radius: 30px !important;
	padding: 10px 26px !important;
	color: var(--csl-navy) !important;
	font-weight: 600 !important;
}

.csl-events-list__image {
	flex: none;
	width: 260px;
}

.csl-events-list__image img {
	width: 100%;
	aspect-ratio: 4 / 3;
	object-fit: cover;
	border-radius: 16px;
	display: block;
}

@media (max-width: 640px) {
	.csl-events-list__event-row .tribe-events-calendar-list__event {
		flex-direction: column-reverse;
	}

	.csl-events-list__image {
		width: 100%;
	}

	.csl-events-list__image img {
		aspect-ratio: 16 / 9;
	}
}

.csl-activity-badges {
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
	margin: 8px 0;
}

/* !important : le reset CSS du plugin (.tribe-common span { padding:0 }) est
   plus spécifique qu'une classe seule sur les pages qui utilisent les vues V2. */
.csl-activity-badge {
	display: inline-flex !important;
	align-items: center;
	padding: 4px 12px !important;
	border-radius: 20px;
	font-size: 12px;
	font-weight: 700;
	background: var(--csl-gray-bg);
	color: var(--csl-text);
}

.csl-activity-badge--plongee {
	background: var(--csl-blue);
	color: #fff;
}

.csl-activity-badge--apnee {
	background: #34c77a;
	color: #fff;
}

.csl-activity-badge--nap {
	background: #f4c542;
	color: var(--csl-text-gray);
}

.csl-activity-badge--enfants {
	background: #f2994a;
	color: #fff;
}

/* Fiche évènement (surcharge tribe-events/single-event.php) */
.csl-event-single .tribe-events-back {
	margin: 0 0 16px;
}

.csl-event-single #tribe-events-footer {
	margin-top: 40px;
	padding-top: 24px;
	border-top: 1px solid var(--csl-gray-bg);
}

.csl-event-single #tribe-events-footer .tribe-events-back {
	margin: 0;
}

.csl-event-header {
	margin-bottom: 24px;
}

.csl-event-header .csl-activity-badges {
	margin: 0 0 8px;
}

.csl-event-title {
	color: var(--csl-navy);
	font-size: 36px;
	font-weight: 900;
	margin: 0 0 20px;
}

.csl-event-meta {
	display: flex;
	align-items: center;
	gap: 24px;
	flex-wrap: wrap;
}

.csl-event-date-badge {
	flex: none;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	width: 84px;
	height: 84px;
	border: 2px solid var(--csl-navy);
	border-radius: 12px;
	text-align: center;
	line-height: 1.2;
}

.csl-event-date-badge__day {
	color: var(--csl-navy);
	font-size: 13px;
	font-weight: 700;
	text-transform: capitalize;
}

.csl-event-date-badge__num {
	color: var(--csl-navy);
	font-size: 22px;
	font-weight: 900;
}

.csl-event-date-badge__month {
	color: var(--csl-navy);
	font-size: 13px;
	font-weight: 700;
	text-transform: capitalize;
}

.csl-event-meta__list {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 6px;
	list-style: none;
	margin: 0;
	padding: 0;
}

.csl-event-meta__item--time {
	font-weight: 400;
}

.csl-event-meta__item {
	display: flex;
	align-items: center;
	gap: 6px;
	color: var(--csl-text);
	font-weight: 600;
}

.csl-event-meta__item a {
	display: flex;
	align-items: center;
	gap: 6px;
	color: var(--csl-blue);
}

.csl-event-meta__item svg {
	flex: none;
	width: 18px;
	height: 18px;
	stroke: var(--csl-blue);
	fill: none;
}

.csl-event-media-row {
	display: grid;
	grid-template-columns: 2fr 1fr;
	gap: 32px;
	align-items: stretch;
	margin: 24px 0;
}

.csl-event-media-row .tribe-events-event-image {
	position: relative;
	align-self: stretch !important;
	min-width: 0;
	min-height: 320px;
	margin: 0;
	overflow: hidden;
	border-radius: 16px;
}

.csl-event-media-row .tribe-events-event-image img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	border-radius: 16px;
	display: block;
}

.csl-event-main {
	margin-top: 24px;
}

.csl-event-actions {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-end;
	gap: 16px;
	margin-top: 24px;
}

.csl-event-cta,
.csl-event-ical {
	display: inline-flex;
	align-items: center;
	gap: 8px;
}

.csl-event-ical svg {
	width: 18px;
	height: 18px;
	stroke: currentColor;
	fill: none;
}

.csl-event-sidebar {
	flex: 1;
	min-width: 260px;
	background: var(--csl-gray-bg);
	border-radius: 16px;
	padding: 24px;
}

.csl-event-sidebar__title {
	color: var(--csl-navy);
	font-size: 14px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.5px;
	margin: 0 0 12px;
}

.csl-event-sidebar__venue {
	color: var(--csl-navy);
	font-weight: 700;
	margin: 0 0 8px;
}

.csl-event-sidebar__address {
	font-style: normal;
	color: var(--csl-text);
	margin: 0 0 16px;
}

.csl-event-sidebar__map {
	margin-top: 16px;
	border-radius: 12px;
	overflow: hidden;
}

.csl-event-sidebar__map iframe {
	width: 100%;
	display: block;
	border: 0;
}

/* Le bouton natif "Ajouter au calendrier" repris dans le style .btn--outline.
   Le wrapper du plugin réserve de la place sous le bouton pour le panneau
   déroulant ; on force la hauteur du wrapper à celle du bouton visible pour
   aligner ses bords avec ceux du bouton "S'inscrire". */
.csl-event-actions .tribe-events,
.csl-event-actions .tribe-events-c-subscribe-dropdown__container,
.csl-event-actions .tribe-events-c-subscribe-dropdown {
	display: flex;
	height: 48px;
	margin: 0 !important;
	overflow: visible;
}

.csl-event-actions .tribe-events-c-subscribe-dropdown__button {
	background: transparent !important;
	border: 2px solid var(--csl-navy) !important;
	border-radius: 30px !important;
	padding: 10px 26px !important;
	height: auto !important;
}

.csl-event-actions .tribe-events-c-subscribe-dropdown__button-text,
.csl-event-actions .tribe-events-c-subscribe-dropdown__button svg {
	color: var(--csl-navy) !important;
	fill: var(--csl-navy) !important;
	stroke: var(--csl-navy) !important;
}

@media (max-width: 780px) {
	.csl-event-media-row {
		grid-template-columns: 1fr;
	}

	.csl-event-sidebar {
		width: 100%;
	}
}

/* En-tête de la page Agenda (surcharge components/content-title.php) */
.csl-events-header {
	display: block !important;
	text-align: center;
	max-width: 760px;
	margin: 0 auto 32px;
}

.csl-events-header .page-content__eyebrow {
	margin-bottom: 4px;
}

.csl-events-header .intro__text {
	margin-top: 20px;
}

/* Barre de filtre (surcharge components/events-bar.php, remplace la recherche) */
.tribe-events-header {
	display: block !important;
}

.csl-events-bar {
	display: flex;
	justify-content: center;
	padding: 0 0 32px;
}

.csl-events-filter__select {
	appearance: none;
	-webkit-appearance: none;
	background-color: #fff;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 7'%3E%3Cpath d='M1 1l4 4 4-4' fill='none' stroke='%232c5093' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right 22px center;
	background-size: 10px 7px;
	border: 2px solid var(--csl-navy);
	border-radius: 30px;
	padding: 12px 46px 12px 24px;
	font-family: var(--font-main);
	font-weight: 600;
	font-size: 15px;
	color: var(--csl-navy);
	cursor: pointer;
	min-width: 280px;
}

.csl-events-filter__select:focus {
	outline: 2px solid var(--csl-blue);
	outline-offset: 2px;
}

/* Barre du haut (flèches, "Aujourd'hui", sélecteur de vue "À venir") : supprimée. */
.tribe-events-c-top-bar {
	display: none !important;
}

/* Séparateurs de mois ("juillet 2026", "août 2026") entre les évènements : supprimés. */
.tribe-events-calendar-list__month-separator {
	display: none !important;
}

/* Bouton "S'abonner au calendrier" : supprimé uniquement sur la liste des évènements
   (ne touche pas le bouton "Ajouter au calendrier" de la fiche évènement). */
body.post-type-archive-tribe_events .tribe-events-c-subscribe-dropdown {
	display: none !important;
}

/* Liste d'étapes numérotées (rond bleu + chiffre blanc, relié par un filet) :
   s'applique à un bloc "Liste" (ordonnée) auquel on ajoute la classe "steps-list". */
.steps-list {
	list-style: none;
	margin: 0;
	padding: 0;
	counter-reset: steps-counter;
}

.steps-list li {
	counter-increment: steps-counter;
	position: relative;
	padding: 0 0 32px 64px;
}

.steps-list li:last-child {
	padding-bottom: 0;
}

.steps-list li::before {
	content: counter(steps-counter);
	position: absolute;
	left: 0;
	top: 0;
	width: 36px;
	height: 36px;
	border-radius: 50%;
	background: var(--csl-blue);
	color: #fff;
	font-family: var(--font-main);
	font-weight: 700;
	font-size: 15px;
	display: flex;
	align-items: center;
	justify-content: center;
	z-index: 1;
}

.steps-list li:not(:last-child)::after {
	content: "";
	position: absolute;
	left: 17px;
	top: 36px;
	bottom: -32px;
	width: 2px;
	background: var(--csl-gray-bg);
}

/* Liens hypertexte dans le corps de texte des pages : bleu foncé + soulignés
   (les boutons/CTA/menus gardent leur propre style, non concernés ici).
   Ciblé sur .site-main (pas juste .page-content) pour couvrir aussi les
   pages avec leur propre hero (Apnée, Handisub...), qui ne passent pas
   par le conteneur .page-content — voir page.php. */
.site-main a:not(.wp-element-button) {
	color: var(--csl-navy-dark);
	text-decoration: underline;
}

/* Photo du hero (accueil + pages d'activités) : occupe toute la hauteur de l'écran
   sur desktop, pour éviter le bandeau blanc sous la photo sur les grands écrans. */
@media (min-width: 901px) {
	.hero.alignfull,
	.page-hero.alignfull {
		min-height: 100vh;
	}
}
