/* ============================================================
   SEDY Manager - Page d'accueil de chaque ecole
   Meme langage visuel que la landing (nav pilule, typo Fraunces
   + Inter + IBM Plex Mono), avec la couleur propre a l'ecole
   utilisee comme accent (fournie par single-ecole.php).
   ============================================================ */

.sedy-ecole-page {
	--sedy-couleur: #4A5FE8;
	--sedy-fond: #F5F3FC;
	--sedy-surface: #FFFFFF;
	--sedy-texte: #17172E;
	--sedy-texte-doux: #66647F;
	--sedy-bordure: #E4E1F3;
	--sedy-bordure-forte: #D2CDEC;
	--sedy-ombre: 0 1px 3px rgba(23, 21, 58, 0.06);
	--sedy-ombre-hover: 0 10px 26px rgba(23, 21, 58, 0.10);
	--sedy-rayon: 16px;

	font-family: 'Inter', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
	color: var(--sedy-texte);
	max-width: 100%;
	margin: 0;
	padding: 0;
	background: var(--sedy-surface);
}

.sedy-ecole-page * {
	box-sizing: border-box;
}

.sedy-ecole-page h1,
.sedy-ecole-page h2,
.sedy-ecole-page h3 {
	font-family: 'Fraunces', Georgia, serif;
	font-weight: 600;
}

/* ---------- Eyebrow (etiquette au-dessus des titres) ---------- */

.sedy-eyebrow {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	text-transform: uppercase;
	letter-spacing: 0.08em;
	font-family: 'IBM Plex Mono', monospace;
	font-size: 0.68rem;
	font-weight: 500;
	color: var(--sedy-couleur);
	margin-bottom: 14px;
}

.sedy-eyebrow::before {
	content: '';
	width: 16px;
	height: 1px;
	background: var(--sedy-couleur);
	display: inline-block;
}

/* ---------- Navigation (pilule flottante) ---------- */

.sedy-ecole-nav {
	position: sticky;
	top: 16px;
	z-index: 20;
	max-width: 1100px;
	margin: 16px auto 0;
	padding: 10px 8px 10px 20px;
	background: rgba(255,255,255,0.78);
	backdrop-filter: saturate(180%) blur(12px);
	border: 1px solid var(--sedy-bordure);
	border-radius: 100px;
	display: flex;
	align-items: center;
	gap: 8px;
}

.sedy-ecole-nav-inner {
	display: flex;
	flex-wrap: wrap;
	gap: 2px;
	align-items: center;
}

.sedy-ecole-nav a {
	color: var(--sedy-texte-doux);
	text-decoration: none;
	font-weight: 500;
	font-size: 0.85rem;
	padding: 9px 14px;
	border-radius: 100px;
	transition: background 0.15s ease, color 0.15s ease;
	white-space: nowrap;
}

.sedy-ecole-nav a:hover {
	background: color-mix(in srgb, var(--sedy-couleur) 12%, transparent);
	color: var(--sedy-couleur);
}

.sedy-ecole-nav-retour {
	color: var(--sedy-texte) !important;
	font-weight: 600 !important;
	background: var(--sedy-fond);
	margin-right: auto;
}

/* ---------- Hero ---------- */

.sedy-ecole-hero {
	position: relative;
	text-align: center;
	padding: 84px 32px 64px;
	overflow: hidden;
	max-width: 1100px;
	margin: 0 auto;
	border-radius: 0 0 32px 32px;
	background:
		radial-gradient(circle at 20% 20%, color-mix(in srgb, var(--sedy-couleur) 16%, transparent) 0%, transparent 45%),
		radial-gradient(circle at 85% 10%, color-mix(in srgb, var(--sedy-couleur) 10%, transparent) 0%, transparent 40%),
		var(--sedy-fond);
}

.sedy-ecole-hero-bg {
	position: absolute;
	inset: 0;
	z-index: 0;
}

.sedy-ecole-hero-bg img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
	transition: opacity 0.3s ease;
}

.sedy-ecole-hero-voile {
	position: absolute;
	inset: 0;
	z-index: 1;
	background: linear-gradient(180deg, color-mix(in srgb, var(--sedy-couleur) 35%, black 8%) 0%, color-mix(in srgb, var(--sedy-couleur) 55%, black 20%) 100%);
	transition: opacity 0.3s ease;
}

.sedy-ecole-hero-contenu {
	position: relative;
	z-index: 2;
	max-width: 640px;
	margin: 0 auto;
}

.sedy-ecole-hero.sedy-hero-texte-clair .sedy-eyebrow {
	color: #fff;
}

.sedy-ecole-hero.sedy-hero-texte-clair .sedy-eyebrow::before {
	background: #fff;
}

.sedy-ecole-hero.sedy-hero-texte-clair .sedy-ecole-titre,
.sedy-ecole-hero.sedy-hero-texte-clair .sedy-ecole-adresse-hero {
	color: #fff;
	text-shadow: 0 2px 10px rgba(0,0,0,0.35);
}

.sedy-ecole-titre {
	color: var(--sedy-couleur);
	font-size: clamp(1.9rem, 4.2vw, 2.7rem);
	font-weight: 600;
	letter-spacing: -0.4px;
	margin: 0 0 12px;
	line-height: 1.15;
}

.sedy-ecole-adresse-hero {
	color: var(--sedy-texte-doux);
	font-size: 0.95rem;
	margin: 0;
}

.sedy-ecole-carte-localisation {
	display: flex;
	align-items: flex-start;
	gap: 14px;
}

.sedy-ecole-icone-lieu {
	font-size: 1.6rem;
	line-height: 1;
	flex-shrink: 0;
}

.sedy-ecole-voir-plus {
	display: inline-block;
	margin-top: 14px;
	color: var(--sedy-couleur);
	font-weight: 500;
	text-decoration: none;
	font-size: 0.95rem;
}

.sedy-ecole-voir-plus:hover {
	text-decoration: underline;
}

/* ---------- Sections ---------- */

.sedy-ecole-section {
	padding: 64px 24px;
}

.sedy-ecole-section-alt {
	background: var(--sedy-fond);
}

.sedy-ecole-section-inner {
	max-width: 1140px;
	margin: 0 auto;
}

.sedy-ecole-section h2 {
	font-size: 1.6rem;
	margin: 0 0 22px;
	color: var(--sedy-texte);
	letter-spacing: -0.3px;
}

/* Blocs d'information (présentation, historique, discipline, localisation,
   calendrier...) : uniquement du texte bien organisé, sans carte ni
   bordure ni ombre - la hiérarchie vient de la typographie, pas d'une forme. */
.sedy-ecole-carte-texte {
	max-width: 700px;
}

.sedy-ecole-carte-texte p {
	margin: 0;
	line-height: 1.8;
	font-size: 1rem;
	color: var(--sedy-texte-doux);
}

.sedy-ecole-carte-texte p + p {
	margin-top: 1em;
}

.sedy-ecole-vide {
	color: var(--sedy-texte-doux);
	font-size: 0.92rem;
}

/* ---------- Cartes generiques (evenements / actualites) ---------- */

.sedy-ecole-carte-image {
	width: 100%;
	height: 150px;
	overflow: hidden;
	background: var(--sedy-fond);
}

.sedy-ecole-carte-image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

.sedy-ecole-carte-corps {
	padding: 16px 18px 18px;
}

.sedy-ecole-carte-corps h3 {
	margin: 0 0 8px;
	font-size: 1.02rem;
	line-height: 1.4;
}

.sedy-ecole-carte-corps h3 a {
	color: var(--sedy-texte);
	text-decoration: none;
}

.sedy-ecole-carte-corps h3 a:hover {
	color: var(--sedy-couleur);
}

.sedy-ecole-carte-corps p {
	margin: 0;
	color: var(--sedy-texte-doux);
	font-size: 0.9rem;
	line-height: 1.6;
}

.sedy-ecole-lieu {
	margin: 4px 0 0 !important;
	font-size: 0.85rem !important;
	color: var(--sedy-texte-doux) !important;
}

/* ---------- Agenda / evenements : ruban horizontal ---------- */

.sedy-ecole-grille-evenements {
	display: flex;
	gap: 18px;
	overflow-x: auto;
	padding-bottom: 8px;
	scroll-snap-type: x proximity;
}

.sedy-ecole-evenement-card {
	scroll-snap-align: start;
	flex: 0 0 260px;
	background: var(--sedy-surface);
	border: 1px solid var(--sedy-bordure);
	border-radius: var(--sedy-rayon);
	overflow: hidden;
	box-shadow: var(--sedy-ombre);
	transition: box-shadow 0.2s ease, border-color 0.2s ease, transform 0.2s ease;
}

.sedy-ecole-evenement-card:hover {
	box-shadow: var(--sedy-ombre-hover);
	border-color: var(--sedy-bordure-forte);
	transform: translateY(-2px);
}

.sedy-ecole-badge-date {
	display: inline-block;
	font-family: 'IBM Plex Mono', monospace;
	background: color-mix(in srgb, var(--sedy-couleur) 12%, white);
	color: var(--sedy-couleur);
	font-weight: 500;
	font-size: 0.72rem;
	padding: 4px 12px;
	border-radius: 100px;
	margin-bottom: 10px;
}

/* ---------- Actualites ---------- */

.sedy-ecole-grille-actualites {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
	gap: 18px;
}

.sedy-ecole-actualite-card {
	background: var(--sedy-surface);
	border: 1px solid var(--sedy-bordure);
	border-radius: var(--sedy-rayon);
	overflow: hidden;
	box-shadow: var(--sedy-ombre);
	transition: box-shadow 0.2s ease, border-color 0.2s ease, transform 0.2s ease;
}

.sedy-ecole-actualite-card:hover {
	box-shadow: var(--sedy-ombre-hover);
	border-color: var(--sedy-bordure-forte);
	transform: translateY(-2px);
}

/* ---------- Administration ---------- */

.sedy-ecole-grille-administration {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
	gap: 22px;
}

.sedy-ecole-membre {
	text-align: center;
}

.sedy-ecole-membre img,
.sedy-ecole-membre-avatar-vide {
	width: 88px;
	height: 88px;
	border-radius: 50%;
	margin: 0 auto 12px;
	display: block;
}

.sedy-ecole-membre img {
	object-fit: cover;
	border: 3px solid var(--sedy-surface);
	outline: 2px solid var(--sedy-couleur);
}

.sedy-ecole-membre-avatar-vide {
	background: color-mix(in srgb, var(--sedy-couleur) 14%, white);
	outline: 2px solid var(--sedy-couleur);
	display: flex;
	align-items: center;
	justify-content: center;
}

.sedy-ecole-membre-avatar-vide span {
	font-family: 'Fraunces', serif;
	color: var(--sedy-couleur);
	font-size: 1.6rem;
	font-weight: 600;
}

.sedy-ecole-membre-nom {
	font-weight: 500;
	margin: 0;
	font-size: 0.95rem;
}

.sedy-ecole-membre-poste {
	color: var(--sedy-texte-doux);
	margin: 2px 0 0;
	font-size: 0.85rem;
}

/* Reste de l'équipe (au-delà des 4 premiers membres) : replié par défaut,
   révélé en douceur au clic sur "Voir toute l'équipe", sans rechargement. */
.sedy-ecole-administration-reste {
	max-height: 0;
	opacity: 0;
	overflow: hidden;
	margin-top: 0;
	transition: max-height 0.4s ease, opacity 0.3s ease, margin-top 0.3s ease;
}

.sedy-ecole-administration-reste.sedy-ecole-administration-reste-ouvert {
	max-height: 2000px;
	opacity: 1;
	margin-top: 22px;
}

.sedy-ecole-btn-voir-plus {
	display: block;
	margin: 26px auto 0;
	background: var(--sedy-surface);
	color: var(--sedy-couleur);
	font-family: 'Inter', sans-serif;
	font-weight: 500;
	font-size: 0.87rem;
	border: 1px solid var(--sedy-bordure-forte);
	border-radius: 100px;
	padding: 10px 24px;
	cursor: pointer;
	transition: background 0.15s ease, border-color 0.15s ease;
}

.sedy-ecole-btn-voir-plus:hover {
	background: color-mix(in srgb, var(--sedy-couleur) 10%, transparent);
	border-color: var(--sedy-couleur);
}

.sedy-ecole-btn-voir-plus-actif {
	background: color-mix(in srgb, var(--sedy-couleur) 12%, white);
	border-color: var(--sedy-couleur);
}

/* ---------- Menu hamburger (mobile) ---------- */

.sedy-nav-burger {
	display: none;
	width: 38px;
	height: 38px;
	border: none;
	background: transparent;
	cursor: pointer;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 5px;
	flex-shrink: 0;
}

.sedy-nav-burger-ligne {
	display: block;
	width: 20px;
	height: 2px;
	background: var(--sedy-texte);
	border-radius: 2px;
	transition: transform 0.3s ease, opacity 0.25s ease;
}

.sedy-nav-burger.actif .sedy-nav-burger-ligne:nth-child(1) {
	transform: translateY(7px) rotate(45deg);
}

.sedy-nav-burger.actif .sedy-nav-burger-ligne:nth-child(2) {
	opacity: 0;
}

.sedy-nav-burger.actif .sedy-nav-burger-ligne:nth-child(3) {
	transform: translateY(-7px) rotate(-45deg);
}

/* ---------- Responsive ---------- */

@media (max-width: 720px) {
	.sedy-ecole-nav {
		margin: 14px 14px 0;
		padding: 8px 8px 8px 18px;
		flex-wrap: wrap;
	}

	.sedy-nav-burger {
		display: flex;
		order: 2;
	}

	.sedy-ecole-nav-inner {
		order: 3;
		flex-direction: column;
		align-items: stretch;
		width: 100%;
		max-height: 0;
		opacity: 0;
		overflow: hidden;
		gap: 0;
		transition: max-height 0.35s ease, opacity 0.3s ease, margin 0.35s ease;
	}

	.sedy-ecole-nav-inner.sedy-nav-ouvert {
		max-height: 480px;
		opacity: 1;
		margin-top: 10px;
	}

	.sedy-ecole-nav-inner a {
		padding: 12px 14px;
		border-top: 1px solid var(--sedy-bordure);
		border-radius: 0;
		white-space: normal;
	}

	.sedy-ecole-nav-retour {
		border-top: none !important;
		margin-right: 0 !important;
	}

	.sedy-ecole-hero {
		padding: 56px 20px 44px;
		border-radius: 0 0 24px 24px;
	}

	.sedy-ecole-section {
		padding: 44px 18px;
	}

	.sedy-ecole-section h2 {
		font-size: 1.35rem;
	}
}
