/*
Theme Name: Clameurs Events
Theme URI: https://clameurs-events.com
Author: WP CLINIQUE
Author URI: https://www.wpclinique.com
Description: Thème FSE sur mesure du site corporate Clameurs Events.
Requires at least: 6.5
Tested up to: 7.0
Requires PHP: 8.1
Version: 0.2.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: clameurs-events
Tags: full-site-editing, block-theme
*/

/* =====================================================================
   Coming soon — réplique de la maquette client (inputs/coming-soon.png)
   Couleurs mesurées sur la maquette (convertie Display P3 → sRGB) :
   fond radial #02344B → #001E30, or charte #FEC400, corps #B4BFC7,
   footer #6A7E8A, texte bouton or #00475F.
   ===================================================================== */

.ce-cs {
	position: relative;
	display: flex;
	flex-direction: column;
	min-height: 100vh;
	min-height: 100svh;
	overflow: hidden;
	background:
		radial-gradient(ellipse 115% 90% at 55% 42%, #073a52 0%, #01293e 55%, #001b2d 100%)
		#001e30;
}

/* Filigrane Ω — contour fin, coupé sur la droite comme sur la maquette */
.ce-cs::after {
	content: "";
	position: absolute;
	top: 29%;
	right: -9vh;
	height: 62vh;
	aspect-ratio: 200.3 / 198.2;
	background: url(assets/images/omega-filigrane.svg) no-repeat center / contain;
	opacity: 0.35;
	pointer-events: none;
}

.ce-cs__header,
.ce-cs__main,
.ce-cs__footer {
	position: relative;
	z-index: 1;
}

/* ------------------------------------------------------------ header */

.ce-cs__header {
	display: flex;
	align-items: center;
	padding: 2.75rem 3rem;
}

.ce-cs__omega {
	width: 48px;
	height: auto;
}

.ce-cs__header-sep {
	width: 1px;
	height: 2.5rem;
	margin: 0 1.75rem;
	background: rgba(255, 255, 255, 0.35);
}

.ce-cs__brand {
	font-size: 0.9375rem;
	font-weight: 700;
	letter-spacing: 0.22em;
	text-transform: uppercase;
	color: #fff;
}

/* -------------------------------------------------------------- main */

.ce-cs__main {
	margin-block: auto;
	padding: 3rem clamp(1.5rem, 8.4vw, 7rem);
}

.ce-cs__title {
	margin: 0;
	font-size: clamp(2.375rem, 0.5rem + 4.7vw, 4.4rem);
	font-weight: 700;
	line-height: 1.16;
	color: #fff;
}

.ce-cs__dot {
	color: var(--wp--preset--color--or, #fec400);
}

.ce-cs__rule {
	width: 5.5rem;
	height: 4px;
	margin: clamp(2.25rem, 4vw, 3.625rem) 0 clamp(2.75rem, 5vw, 4.5rem);
	background: var(--wp--preset--color--or, #fec400);
}

.ce-cs__text {
	margin: 0;
	font-size: clamp(1.0625rem, 0.75rem + 1vw, 1.625rem);
	line-height: 1.75;
	color: var(--wp--preset--color--gris-bleute, #b4bfc7);
}

/* ----------------------------------------------------------- boutons */

.ce-cs__actions {
	display: flex;
	flex-wrap: wrap;
	gap: 1.25rem 2.625rem;
	margin-top: clamp(3rem, 8vh, 7rem);
}

.ce-btn {
	display: inline-flex;
	align-items: center;
	gap: 0.875rem;
	min-height: 44px;
	padding: 1.75rem 4.25rem;
	font-size: 1rem;
	font-weight: 600;
	letter-spacing: 0.2em;
	text-transform: uppercase;
	text-decoration: none;
	transition: background-color 0.2s ease, border-color 0.2s ease, filter 0.2s ease;
}

.ce-btn__icon {
	width: 1.375rem;
	height: 1.375rem;
	flex-shrink: 0;
}

.ce-btn--or {
	background: var(--wp--preset--color--or, #fec400);
	color: var(--wp--preset--color--bleu-profond, #00475f);
}

.ce-btn--or:hover,
.ce-btn--or:focus-visible {
	filter: brightness(1.07);
	color: var(--wp--preset--color--bleu-profond, #00475f);
}

.ce-btn--contour {
	border: 1px solid rgba(255, 255, 255, 0.42);
	color: #b8c3cb;
}

.ce-btn--contour:hover,
.ce-btn--contour:focus-visible {
	border-color: rgba(255, 255, 255, 0.85);
	background: rgba(255, 255, 255, 0.05);
	color: #fff;
}

/* ------------------------------------------------------------ footer */

.ce-cs__footer {
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	gap: 1.5rem 3rem;
	padding: 2.5rem 3.5rem;
}

.ce-cs__venues {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	column-gap: 2.75rem;
	row-gap: 0.125rem;
	max-width: 68%;
	margin: 0;
	padding: 0;
	list-style: none;
}

.ce-cs__venues li {
	display: inline-flex;
	align-items: center;
	gap: 2.5rem;
}

/* Pavés séparateurs décoratifs de la maquette (sauf après le dernier lieu) */
.ce-cs__venues li:not(:last-child)::after {
	content: "";
	width: 2.25rem;
	height: 0.875rem;
	background: rgba(126, 168, 190, 0.18);
}

.ce-cs__venues a {
	/* zone tactile ≥ 44px sans gonfler la hauteur visuelle */
	padding-block: 0.75rem;
	margin-block: -0.75rem;
	font-size: 0.875rem;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	text-decoration: none;
	color: #6a7e8a;
	transition: color 0.2s ease;
}

.ce-cs__venues a:hover,
.ce-cs__venues a:focus-visible {
	color: #fff;
}

.ce-cs__copy {
	margin: 0;
	font-size: 0.9375rem;
	letter-spacing: 0.08em;
	color: #6a7e8a;
	white-space: nowrap;
}

/* ---------------------------------------------------------- mobile */

@media (max-width: 781px) {
	.ce-cs__header {
		padding: 1.5rem;
	}

	.ce-cs__omega {
		width: 38px;
	}

	.ce-cs__header-sep {
		margin: 0 1.125rem;
	}

	.ce-cs__brand {
		font-size: 0.8125rem;
	}

	.ce-cs__main {
		padding: 2.5rem 1.5rem;
	}

	.ce-cs__br-lg {
		display: none;
	}

	.ce-cs__actions {
		flex-direction: column;
		align-items: stretch;
		gap: 1rem;
	}

	.ce-btn {
		justify-content: center;
		padding: 1.375rem 2rem;
	}

	.ce-cs::after {
		top: auto;
		bottom: -8%;
		right: -38%;
		width: 105vw;
		height: auto;
		opacity: 0.3;
	}

	.ce-cs__footer {
		flex-direction: column;
		align-items: flex-start;
		gap: 2rem;
		padding: 2rem 1.5rem 2.5rem;
	}

	.ce-cs__venues {
		flex-direction: column;
		align-items: flex-start;
		max-width: 100%;
		row-gap: 0.5rem;
	}

	/* En colonne, les pavés séparateurs de la maquette desktop n'ont plus de sens */
	.ce-cs__venues li:not(:last-child)::after {
		display: none;
	}
}