/*
Theme Name: Cloudmon FR
Description: Thème sombre aux couleurs de Cloudmon pour cloudmon.fr (ITOM CONSULT Océan Indien).
Author: ITOM CONSULT Océan Indien
Version: 1.1.0
Requires at least: 6.4
Requires PHP: 7.4
License: GPL-2.0-or-later
Text Domain: cloudmon-fr
*/

/* ---------- En-tête ---------- */
.cm-header {
	position: sticky;
	top: 0;
	z-index: 50;
	background: rgba(9, 7, 29, 0.82);
	backdrop-filter: blur(14px);
	-webkit-backdrop-filter: blur(14px);
	border-bottom: 1px solid rgba(255, 255, 255, 0.06);
}
.admin-bar .cm-header { top: 32px; }
@media (max-width: 782px) { .admin-bar .cm-header { top: 46px; } }

.cm-logo { margin: 0; font-size: 1.35rem; font-weight: 700; letter-spacing: 0.02em; }
.cm-logo a { color: #fff; text-decoration: none; display: inline-flex; align-items: center; gap: 0.55rem; }
.cm-logo a::before {
	content: "";
	width: 26px; height: 26px; border-radius: 50%;
	background:
		radial-gradient(circle at center, #09071D 0 34%, transparent 35%),
		radial-gradient(circle at center, #6C61FF 0 52%, transparent 53%),
		radial-gradient(circle at center, #09071D 0 62%, transparent 63%),
		linear-gradient(135deg, #0072FF, #6C61FF);
	box-shadow: 0 0 18px rgba(108, 97, 255, 0.55);
}
.cm-logo span { color: #8EA8FF; font-weight: 500; }

.cm-header .wp-block-navigation a { color: #E4E6F1; text-decoration: none; }
.cm-header .wp-block-navigation a:hover { color: #fff; }
.cm-header .wp-block-navigation__responsive-container.is-menu-open { background: #09071D; color: #E4E6F1; }
.cm-header .wp-block-button__link { padding: 0.6em 1.2em; font-size: 0.88rem; }

/* ---------- Hero ---------- */
.cm-hero {
	position: relative;
	overflow: hidden;
	padding-top: clamp(4rem, 10vw, 8rem) !important;
	padding-bottom: clamp(3.5rem, 8vw, 6.5rem) !important;
	margin-top: 0 !important;
	background:
		radial-gradient(60% 70% at 85% 10%, rgba(108, 97, 255, 0.35), transparent 70%),
		radial-gradient(50% 60% at 10% 90%, rgba(0, 114, 255, 0.28), transparent 70%),
		linear-gradient(180deg, #0B0926 0%, #09071D 100%);
	border-bottom: 1px solid rgba(255, 255, 255, 0.06);
}
.cm-hero::after {
	content: "";
	position: absolute; inset: 0;
	background-image:
		linear-gradient(rgba(142, 168, 255, 0.07) 1px, transparent 1px),
		linear-gradient(90deg, rgba(142, 168, 255, 0.07) 1px, transparent 1px);
	background-size: 48px 48px;
	mask-image: radial-gradient(ellipse at center, #000 30%, transparent 75%);
	-webkit-mask-image: radial-gradient(ellipse at center, #000 30%, transparent 75%);
	pointer-events: none;
}
.cm-hero > * { position: relative; z-index: 1; }
.cm-hero h1 { max-width: 18ch; }
.cm-hero p { max-width: 62ch; font-size: 1.15rem; color: #C9CCE3; }
.cm-hero .wp-block-buttons { margin-top: 2rem; }
.cm-eyebrow {
	display: inline-block;
	padding: 0.35em 0.9em;
	border: 1px solid rgba(142, 168, 255, 0.35);
	border-radius: 999px;
	background: rgba(108, 97, 255, 0.12);
	color: #B7C4FF;
	font-size: 0.78rem;
	font-weight: 600;
	letter-spacing: 0.06em;
	text-transform: uppercase;
}

/* ---------- Boutons ---------- */
.wp-block-button__link { transition: transform .15s ease, box-shadow .15s ease, filter .15s ease; }
.wp-block-button:not(.is-style-outline) .wp-block-button__link { box-shadow: 0 8px 28px rgba(0, 114, 255, 0.35); }
.wp-block-button__link:hover { transform: translateY(-1px); filter: brightness(1.08); }
.wp-block-button.is-style-outline .wp-block-button__link {
	background: transparent !important;
	border: 1px solid rgba(255, 255, 255, 0.28);
	color: #fff;
}
.wp-block-button.is-style-outline .wp-block-button__link:hover { border-color: #8EA8FF; }

/* ---------- Sections ---------- */
.cm-section { padding-top: clamp(3rem, 6vw, 5rem); padding-bottom: 0.5rem; }
.cm-section > h2 { margin-bottom: 1.5rem; }
.cm-section > p { color: #C9CCE3; max-width: 70ch; }

/* ---------- Cartes ---------- */
.cm-cards, .cm-stats { gap: 1.25rem !important; margin-top: 1.25rem; }
.cm-cards > .wp-block-column,
.cm-stats > .wp-block-column,
.cm-card {
	background: linear-gradient(180deg, rgba(25, 21, 63, 0.9), rgba(17, 14, 46, 0.9));
	border: 1px solid rgba(142, 168, 255, 0.14);
	border-radius: 16px;
	padding: 1.6rem 1.6rem 1.3rem;
	transition: border-color .2s ease, transform .2s ease;
}
.cm-cards > .wp-block-column:hover, .cm-card:hover { border-color: rgba(142, 168, 255, 0.4); transform: translateY(-2px); }
.cm-cards h3 { margin-top: 0; }
.cm-cards p, .cm-card p, .cm-card li, .cm-cards li { color: #C9CCE3; }

.cm-stats h3 {
	margin: 0;
	font-size: clamp(2rem, 4vw, 2.7rem);
	font-weight: 700;
	background: linear-gradient(90deg, #4C9BFF, #A79FFF);
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent;
}
.cm-stats p { margin-top: 0.4rem; color: #A6AACB; font-size: 0.95rem; }

.cm-card { margin-top: 1.25rem !important; }
.cm-card:first-of-type { margin-top: clamp(3rem, 6vw, 5rem) !important; }
.cm-card h2 { margin-top: 0.2rem; font-size: 1.5rem; }
.cm-num {
	font-size: 0.85rem; font-weight: 700; letter-spacing: 0.1em;
	background: linear-gradient(90deg, #4C9BFF, #A79FFF);
	-webkit-background-clip: text; background-clip: text; color: transparent;
}

/* Listes à puces */
.cm-card ul, .cm-cards ul, .cm-legal ul { list-style: none; padding-left: 0; }
.cm-card li, .cm-cards li { position: relative; padding-left: 1.4rem; margin: 0.45rem 0; }
.cm-card li::before, .cm-cards li::before {
	content: ""; position: absolute; left: 0; top: 0.62em;
	width: 8px; height: 8px; border-radius: 50%;
	background: linear-gradient(135deg, #0072FF, #6C61FF);
	box-shadow: 0 0 8px rgba(108, 97, 255, 0.7);
}

/* ---------- Tableau ---------- */
.wp-block-table { border-radius: 16px; overflow: hidden; border: 1px solid rgba(142, 168, 255, 0.14); }
.wp-block-table table { border-collapse: collapse; width: 100%; }
.wp-block-table thead { border: 0; }
.wp-block-table th {
	background: rgba(108, 97, 255, 0.16); color: #fff; text-align: left; font-weight: 600;
	padding: 0.9rem 1.2rem; border: 0;
}
.wp-block-table td { padding: 0.85rem 1.2rem; border: 0; border-top: 1px solid rgba(142, 168, 255, 0.1); color: #C9CCE3; }
.wp-block-table tbody tr:nth-child(odd) td { background: rgba(255, 255, 255, 0.02); }
.wp-block-table td:first-child { color: #fff; font-weight: 600; }

/* ---------- Appel à l'action ---------- */
.cm-cta {
	margin-top: clamp(3.5rem, 7vw, 6rem) !important;
	margin-bottom: clamp(3rem, 6vw, 5rem);
	padding: clamp(2.2rem, 5vw, 3.5rem) !important;
	border-radius: 22px;
	text-align: center;
	background:
		radial-gradient(70% 120% at 50% 0%, rgba(108, 97, 255, 0.35), transparent 70%),
		linear-gradient(180deg, #16123A, #0F0C2C);
	border: 1px solid rgba(142, 168, 255, 0.22);
}
.cm-cta h2 { margin-top: 0; }
.cm-cta p { color: #C9CCE3; }
.cm-cta .wp-block-buttons { justify-content: center; }

/* ---------- Pages légales ---------- */
.cm-legal { max-width: 820px; margin-bottom: 4rem; }
.cm-legal h2 { font-size: 1.35rem; margin-top: 2.2rem; }
.cm-legal p { color: #C9CCE3; }

/* ---------- Pied de page ---------- */
.cm-footer {
	margin-top: 0 !important;
	border-top: 1px solid rgba(255, 255, 255, 0.07);
	background: #070516;
	font-size: 0.92rem;
	color: #A6AACB;
}
.cm-footer h4 { color: #fff; font-size: 0.95rem; margin-bottom: 0.6rem; }
.cm-footer a { color: #A6AACB; text-decoration: none; }
.cm-footer a:hover { color: #fff; }
.cm-footer ul { list-style: none; padding: 0; margin: 0; }
.cm-footer li { margin: 0.35rem 0; }
.cm-footer .cm-copy { border-top: 1px solid rgba(255, 255, 255, 0.07); padding-top: 1.2rem; font-size: 0.82rem; }

/* Divers */
::selection { background: #6C61FF; color: #fff; }
main.wp-block-group { margin-top: 0 !important; }
@media (max-width: 781px) {
	.cm-hero h1 { max-width: none; }
}
@media (max-width: 900px) { .cm-hide-mobile { display: none !important; } }

/* Logo officiel (image) */
.cm-logo-img a::before { display: none; }
.cm-logo-img img { height: 34px; width: auto; display: block; }
.cm-footer .cm-logo-img img { height: 30px; }
