/* LoveObese Premium UI — réutilisable
   Classes préfixées en lo- pour éviter les collisions CMS.
*/

@property --lo-angle {
	syntax: "<angle>";
	initial-value: 135deg;
	inherits: false;
}

:root {
	--lo-bg: #fff7fb;
	--lo-surface: rgba(255, 255, 255, 0.86);
	--lo-surface-strong: #ffffff;
	--lo-text: #231824;
	--lo-muted: #6d5b68;
	--lo-primary: #d72d79;
	--lo-primary-dark: #9f1858;
	--lo-secondary: #6f3cff;
	--lo-gold: #f3b24d;
	--lo-border: rgba(215, 45, 121, 0.18);
	--lo-shadow: 0 18px 55px rgba(111, 60, 255, 0.14), 0 8px 24px rgba(215, 45, 121, 0.12);
	--lo-radius: 26px;
}

.lo-premium {
	box-sizing: border-box;
	color: var(--lo-text);
	font-family: inherit;
}

/* Titres premium uniquement dans les blocs LoveObese */
.lo-premium h2,
.lo-premium h3 {
	position: relative;
	margin: 0 0 16px;
	color: var(--lo-text) !important;
	background: transparent !important;
	font-weight: 800;
	line-height: 1.12;
	letter-spacing: -0.03em;
}

.lo-premium h2 {
	font-size: clamp(28px, 3.4vw, 44px);
}

.lo-premium h3 {
	font-size: clamp(25px, 3vw, 39px);
}

.lo-premium h2::after,
.lo-premium h3::after {
	content: "";
	display: block;
	width: 76px;
	height: 4px;
	margin-top: 13px;
	border-radius: 999px;
	background: linear-gradient(135deg, var(--lo-primary), var(--lo-secondary));
	box-shadow: 0 8px 18px rgba(215,45,121,0.22);
}

.lo-premium *,
.lo-premium *::before,
.lo-premium *::after {
	box-sizing: border-box;
}

/* =========================================================
   Titres premium — contenus CMS + blocs LoveObese
   Ne cible pas les images, ni les feeds profils.
========================================================= */

.lo-premium h2,
.lo-premium h3,
.sscms_content_post h2,
.sscms_content_post h3,
.sscms_content_cat h2,
.sscms_content_cat h3,
.sscms_content_index .grid_8 > h2,
.sscms_content_index .grid_8 > h3 {
	position: relative;
	margin-top: 42px;
	margin-bottom: 18px;
	color: var(--lo-text) !important;
	background: transparent !important;
	font-weight: 800;
	line-height: 1.12;
	letter-spacing: -0.03em;
}

.lo-premium h2,
.sscms_content_post h2,
.sscms_content_cat h2,
.sscms_content_index .grid_8 > h2 {
	font-size: clamp(28px, 3.4vw, 44px);
}

.lo-premium h3,
.sscms_content_post h3,
.sscms_content_cat h3,
.sscms_content_index .grid_8 > h3 {
	font-size: clamp(24px, 3vw, 36px);
}

.lo-premium h2::after,
.lo-premium h3::after,
.sscms_content_post h2::after,
.sscms_content_post h3::after,
.sscms_content_cat h2::after,
.sscms_content_cat h3::after,
.sscms_content_index .grid_8 > h2::after,
.sscms_content_index .grid_8 > h3::after {
	content: "";
	display: block;
	width: 76px;
	height: 4px;
	margin-top: 13px;
	border-radius: 999px;
	background: linear-gradient(135deg, var(--lo-primary), var(--lo-secondary));
	box-shadow: 0 8px 18px rgba(215,45,121,0.22);
}

/* Ajustement : dans les blocs premium, le premier titre ne doit pas créer trop d’espace */
.lo-premium h2:first-child,
.lo-premium h3:first-child,
.lo-section-head h2,
.lo-section-head h3 {
	margin-top: 0;
}

/* Sécurité : ne pas transformer les titres des cartes, menus, galeries ou sidebar */
.sscms_content_index #ss_sidebar h3,
.sscms_content_index .classic_display_article h3,
.sscms_content_index .article_title_carre,
.sscms_content_index .ssmenuli,
.sscms_content_index #ss_sidebar h3::after,
.sscms_content_index .classic_display_article h3::after,
.sscms_content_index .article_title_carre::after,
.sscms_content_index .ssmenuli::after {
	all: revert;
}

.lo-hero-intro {
	position: relative;
	overflow: hidden;
	margin: 24px 0 34px;
	padding: clamp(22px, 4vw, 38px);
	border: 1px solid var(--lo-border);
	border-radius: var(--lo-radius);
	background:
		linear-gradient(var(--lo-angle), rgba(255,255,255,0.95), rgba(255,247,251,0.92), rgba(255,255,255,0.88)),
		radial-gradient(circle at top left, rgba(215,45,121,0.18), transparent 34%),
		radial-gradient(circle at bottom right, rgba(111,60,255,0.16), transparent 36%);
	box-shadow: var(--lo-shadow);
	isolation: isolate;
	animation: lo-gradient-slow 10s linear infinite;
}

.lo-hero-intro::before {
	content: "";
	position: absolute;
	inset: -2px;
	z-index: -1;
	border-radius: inherit;
	background: conic-gradient(from var(--lo-angle), rgba(215,45,121,0.4), rgba(111,60,255,0.32), rgba(243,178,77,0.34), rgba(215,45,121,0.4));
	filter: blur(22px);
	opacity: 0.36;
	animation: lo-gradient-slow 8s linear infinite;
}

.lo-hero-intro p {
	margin: 0 0 14px;
	font-size: clamp(16px, 1.8vw, 19px);
	line-height: 1.75;
}

.lo-kicker {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	width: fit-content;
	margin: 0 0 14px !important;
	padding: 8px 13px;
	border: 1px solid rgba(215,45,121,0.18);
	border-radius: 999px;
	background: rgba(255,255,255,0.72);
	color: var(--lo-primary-dark);
	font-size: 13px !important;
	font-weight: 700;
	letter-spacing: 0.02em;
	text-transform: uppercase;
	box-shadow: 0 8px 18px rgba(215,45,121,0.08);
}

.lo-proofbar {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	margin: 22px 0 24px;
}

.lo-proofbar span {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 10px 13px;
	border: 1px solid rgba(35,24,36,0.08);
	border-radius: 999px;
	background: rgba(255,255,255,0.82);
	color: var(--lo-text);
	font-size: 14px;
	font-weight: 700;
	box-shadow: 0 8px 20px rgba(35,24,36,0.06);
	transform: translateY(0);
	transition: transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease;
}

.lo-proofbar span:hover {
	transform: translateY(-2px);
	border-color: rgba(215,45,121,0.28);
	box-shadow: 0 14px 28px rgba(215,45,121,0.13);
}

.lo-cta-row {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
	margin-top: 18px;
}

.lo-btn {
	position: relative;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 46px;
	padding: 13px 18px;
	border-radius: 999px;
	font-weight: 800;
	text-decoration: none !important;
	line-height: 1.15;
	overflow: hidden;
	transform: translateY(0);
	transition: transform 0.25s ease, box-shadow 0.25s ease, background 0.25s ease;
}

.lo-btn::after {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(110deg, transparent 0%, rgba(255,255,255,0.42) 40%, transparent 76%);
	transform: translateX(-130%);
	animation: lo-shine 4.2s ease-in-out infinite;
}

.lo-btn:hover {
	transform: translateY(-2px);
}

.lo-btn-primary {
	background: linear-gradient(135deg, var(--lo-primary), var(--lo-secondary));
	color: #fff !important;
	box-shadow: 0 12px 28px rgba(215,45,121,0.3);
}

.lo-btn-secondary {
	border: 1px solid rgba(215,45,121,0.2);
	background: rgba(255,255,255,0.78);
	color: var(--lo-primary-dark) !important;
	box-shadow: 0 8px 22px rgba(35,24,36,0.07);
}

.lo-trust-section,
.lo-faq-section {
	position: relative;
	margin: clamp(32px, 5vw, 58px) 0;
	padding: clamp(22px, 4vw, 38px);
	border-radius: var(--lo-radius);
	background:
		linear-gradient(180deg, rgba(255,255,255,0.94), rgba(255,247,251,0.86)),
		radial-gradient(circle at 15% 0%, rgba(215,45,121,0.13), transparent 32%),
		radial-gradient(circle at 90% 100%, rgba(111,60,255,0.12), transparent 34%);
	border: 1px solid var(--lo-border);
	box-shadow: var(--lo-shadow);
}

.lo-section-head {
	max-width: 780px;
	margin-bottom: 24px;
}

.lo-section-head h3 {
	margin: 0 0 12px;
	font-size: clamp(25px, 3vw, 39px);
	line-height: 1.12;
	letter-spacing: -0.03em;
	color: var(--lo-text) !important;
	background: transparent !important;
}

.lo-section-head p {
	margin: 0;
	color: var(--lo-muted);
	font-size: clamp(16px, 1.7vw, 18px);
	line-height: 1.7;
}

.lo-card-grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 16px;
}

.lo-card {
	position: relative;
	overflow: hidden;
	min-height: 245px;
	padding: 24px;
	border-radius: 22px;
	background: var(--lo-surface);
	border: 1px solid rgba(255,255,255,0.75);
	box-shadow: 0 10px 30px rgba(35,24,36,0.07);
	transition: transform 0.28s ease, box-shadow 0.28s ease, border-color 0.28s ease;
}

.lo-card::before {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(135deg, rgba(215,45,121,0.08), transparent 42%, rgba(111,60,255,0.08));
	opacity: 0;
	transition: opacity 0.28s ease;
}

.lo-card:hover {
	transform: translateY(-6px);
	border-color: rgba(215,45,121,0.24);
	box-shadow: 0 20px 42px rgba(111,60,255,0.14);
}

.lo-card:hover::before {
	opacity: 1;
}

.lo-card-icon {
	position: relative;
	z-index: 1;
	display: grid;
	place-items: center;
	width: 52px;
	height: 52px;
	margin-bottom: 16px;
	border-radius: 18px;
	background: linear-gradient(135deg, rgba(215,45,121,0.14), rgba(111,60,255,0.14));
	font-size: 25px;
	box-shadow: inset 0 0 0 1px rgba(255,255,255,0.7);
}

.lo-card h4 {
	position: relative;
	z-index: 1;
	margin: 0 0 10px;
	font-size: 20px;
	line-height: 1.2;
	color: var(--lo-text)!important;
	background:transparent!important;
}

.lo-card p {
	position: relative;
	z-index: 1;
	margin: 0;
	color: var(--lo-muted);
	font-size: 16px;
	line-height: 1.7;
}

.lo-faq-list {
	display: grid;
	gap: 12px;
}

.lo-faq-item {
	border: 1px solid rgba(215,45,121,0.14);
	border-radius: 18px;
	background: rgba(255,255,255,0.82);
	box-shadow: 0 8px 22px rgba(35,24,36,0.05);
	overflow: hidden;
}

.lo-faq-item summary {
	position: relative;
	cursor: pointer;
	padding: 18px 54px 18px 18px;
	color: var(--lo-text);
	font-weight: 800;
	list-style: none;
}

.lo-faq-item summary::-webkit-details-marker {
	display: none;
}

.lo-faq-item summary::after {
	content: "+";
	position: absolute;
	top: 50%;
	right: 18px;
	width: 28px;
	height: 28px;
	display: grid;
	place-items: center;
	border-radius: 999px;
	background: linear-gradient(135deg, var(--lo-primary), var(--lo-secondary));
	color: #fff;
	transform: translateY(-50%);
	transition: transform 0.25s ease;
}

.lo-faq-item[open] summary::after {
	content: "–";
	transform: translateY(-50%) rotate(180deg);
}

.lo-faq-item p {
	margin: 0;
	padding: 0 18px 18px;
	color: var(--lo-muted);
	font-size: 16px;
	line-height: 1.7;
}

@keyframes lo-gradient-slow {
	to {
		--lo-angle: 495deg;
	}
}

@keyframes lo-shine {
	0%, 62% {
		transform: translateX(-130%);
	}
	100% {
		transform: translateX(130%);
	}
}

@supports (animation-timeline: view()) {
	.lo-trust-section,
	.lo-faq-section,
	.lo-card {
		animation: lo-soft-reveal both;
		animation-timeline: view();
		animation-range: entry 8% cover 32%;
	}

	@keyframes lo-soft-reveal {
		from {
			opacity: 0;
			transform: translateY(22px) scale(0.98);
		}
		to {
			opacity: 1;
			transform: translateY(0) scale(1);
		}
	}
}

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

	.lo-card {
		min-height: auto;
	}
}

@media (max-width: 640px) {
	.lo-hero-intro,
	.lo-trust-section,
	.lo-faq-section {
		padding: 20px;
		border-radius: 20px;
	}

	.lo-proofbar {
		display: grid;
		grid-template-columns: 1fr;
	}

	.lo-proofbar span,
	.lo-btn {
		width: 100%;
	}

	.lo-cta-row {
		display: grid;
		grid-template-columns: 1fr;
	}
}

@media (prefers-reduced-motion: reduce) {
	.lo-hero-intro,
	.lo-hero-intro::before,
	.lo-btn::after,
	.lo-trust-section,
	.lo-faq-section,
	.lo-card {
		animation: none !important;
	}

	.lo-proofbar span,
	.lo-btn,
	.lo-card {
		transition: none !important;
	}
}

/* =========================================================
   LoveObese — extensions premium strictement préfixées
   Ne touche pas aux images, ni aux feeds/blocs profils.
========================================================= */

.lo-linkhub {
	margin: clamp(34px, 5vw, 62px) 0;
	padding: clamp(22px, 4vw, 38px);
	border: 1px solid var(--lo-border);
	border-radius: var(--lo-radius);
	background:
		linear-gradient(135deg, rgba(255,255,255,0.96), rgba(255,247,251,0.9)),
		radial-gradient(circle at top left, rgba(215,45,121,0.13), transparent 32%),
		radial-gradient(circle at bottom right, rgba(111,60,255,0.13), transparent 34%);
	box-shadow: var(--lo-shadow);
}

.lo-link-grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 14px;
	margin: 22px 0 0 !important;
	padding: 0 !important;
	list-style: none !important;
}

.lo-link-grid li {
	margin: 0 !important;
	padding: 0 !important;
	list-style: none !important;
	background: transparent !important;
	border: 0 !important;
	box-shadow: none !important;
}

.lo-link-grid li::before {
	display: none !important;
	content: none !important;
}

.lo-link-card {
	position: relative;
	display: block;
	min-height: 132px;
	padding: 20px;
	border: 1px solid rgba(215,45,121,0.14);
	border-radius: 22px;
	background: rgba(255,255,255,0.78);
	text-decoration: none !important;
	box-shadow: 0 10px 28px rgba(35,24,36,0.06);
	overflow: hidden;
	transition: transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease;
}

.lo-link-card::before {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(135deg, rgba(215,45,121,0.08), transparent 42%, rgba(111,60,255,0.08));
	opacity: 0;
	transition: opacity 0.25s ease;
}

.lo-link-card:hover {
	transform: translateY(-4px);
	border-color: rgba(215,45,121,0.28);
	box-shadow: 0 18px 38px rgba(111,60,255,0.13);
}

.lo-link-card:hover::before {
	opacity: 1;
}

.lo-link-card strong,
.lo-link-card span {
	position: relative;
	z-index: 1;
	display: block;
}

.lo-link-card strong {
	margin-bottom: 8px;
	color: var(--lo-text);
	font-size: 18px;
	line-height: 1.2;
}

.lo-link-card span {
	color: var(--lo-muted);
	font-size: 15px;
	line-height: 1.55;
}

.lo-note-premium {
	margin: 28px 0;
	padding: 20px 24px;
	border: 1px solid rgba(215,45,121,0.18);
	border-radius: 22px;
	background: linear-gradient(135deg, rgba(255,255,255,0.95), rgba(255,247,251,0.88));
	box-shadow: 0 12px 28px rgba(35,24,36,0.07);
}

.lo-note-premium strong {
	color: var(--lo-primary-dark);
}

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

@media (max-width: 640px) {
	.lo-linkhub {
		padding: 20px;
		border-radius: 22px;
	}

	.lo-link-grid {
		grid-template-columns: 1fr;
	}

	.lo-link-card {
		min-height: auto;
	}
}


#sscms-data-list-child .sscms_geodim_dep h3 a{
	
	color: var(--lo-text) !important;
	background: transparent !important;

}