/*
Theme Name: CSSMA
Theme URI: https://cssma.space
Author: WEB LAZER
Author URI: https://profiles.wordpress.org/weblazer/
Description: Le thème officiel de CSSMA
Requires at least: 6.8
Tested up to: 6.8
Requires PHP: 5.7
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
*/

/* === CSS VARIABLES === */
:root {
	--transition-base: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);
	--transition-smooth: all 0.4s cubic-bezier(0.25, 0.8, 0.25, 1);
	--transition-filter: filter 0.4s ease;
	--border-radius-base: 3px;
	--border-radius-large: 16px;
	--border-radius-pill: 100rem;
	--spacing-base: 1rem;
	--spacing-large: 2rem;
	--glassmorphism-gradient: linear-gradient(135deg, rgba(255, 255, 255, 0.1) 0%, rgba(255, 255, 255, 0.05) 100%);
	--glassmorphism-gradient-hover: linear-gradient(135deg, rgba(255, 255, 255, 0.15) 0%, rgba(255, 255, 255, 0.08) 100%);
	--glassmorphism-blur: blur(24px) saturate(180%);
	--glassmorphism-border: 1px solid rgba(255, 255, 255, 0.125);
	--glassmorphism-border-highlight: 1px solid rgba(255, 255, 255, 0.25);
	--glassmorphism-shadow: inset 0 0 20px rgba(255, 255, 255, 0.05);
	--glassmorphism-shadow-hover: inset 0 0 20px rgba(255, 255, 255, 0.1);
}

/* === RESET & BASE === */
* {
	margin: 0;
	padding: 0;
	box-sizing: border-box;
}

html {
	font-size: 16px;
	scroll-behavior: smooth;
}

/* html.has-modal-open {
	overflow: initial !important;
} */

body {
	-webkit-font-smoothing: antialiased;
	background-image: url('/wp-content/uploads/background.svg');
	background-size: cover;
	background-position: center center;
	background-repeat: no-repeat;
	background-attachment: fixed;
}

/* === TYPOGRAPHY === */
h1,
h2,
h3,
h4,
h5,
h6 {
	margin-top: 0.5em !important;
}

h2 {
	color: var(--wp--preset--color--custom-button-background);
}

b,
strong,
mark {
	color: var(--wp--preset--color--custom-button-background) !important;
	font-weight: bolder;
}

/* Underlined Headings */
:is(h1, h2, h3, h4, h5, h6)[style*="underline"] {
	position: relative;
	margin-bottom: 2.5rem !important;
	text-decoration: none !important;
}

:is(h1, h2, h3, h4, h5, h6)[style*="underline"].has-text-align-left::after {
	content: '';
	position: absolute;
	bottom: -1.618rem !important;
	left: 0;
	transform: translate(0, -100%);
	width: 4.5rem;
	height: 6px;
	background: var(--wp--preset--color--custom-button-background);
}

:is(h1, h2, h3, h4, h5, h6)[style*="underline"].has-text-align-center::after {
	content: '';
	position: absolute;
	bottom: -1.618rem !important;
	left: 50%;
	transform: translate(-50%, -100%);
	width: 4.5rem;
	height: 6px;
	background: var(--wp--preset--color--custom-button-background);
}

/* === LISTS === */
ul {
	padding-inline-start: var(--spacing-base);
}

body.home ul.wp-block-list {
	list-style-type: none;
}

body.home ul.wp-block-list li::before {
	content: "\f046";
	display: inline-block;
	font: normal normal normal 14px / 1 FontAwesome;
	font-size: inherit;
	text-rendering: auto;
	-webkit-font-smoothing: antialiased;
	margin-right: 0.5rem;
}

ul.wp-block-list li {
	margin-top: 0.33rem;
}

p+ul {
	margin-top: var(--spacing-base);
}

/* === LINKS === */
[style*="text-decoration:none"]>a {
	text-decoration: none;
}

body.home .breadcrumbs {
	display: none;
}

.yoast-breadcrumbs a {
	text-decoration: none;
	color: #ffffff;
}

html.has-modal-open header>.glassmorphism {
	backdrop-filter: none !important;
	-webkit-backdrop-filter: none !important;
}

header nav ul li a {
	line-height: 1em;
}

/* === NAVIGATION === */

.wp-block-navigation .wp-block-navigation-item__content.wp-block-navigation-item__content {
	color: var(--wp--preset--color--white) !important;
}

.wp-block-navigation__responsive-container-close {
	right: var(--spacing-large) !important;
	top: var(--spacing-large) !important;
}

.wp-block-navigation__responsive-container-close svg,
.wp-block-navigation__responsive-container-open svg {
	fill: var(--wp--preset--color--white) !important;
}

.wp-block-navigation .wp-block-button {
  margin-top: 0 !important;
}

.wp-block-navigation .wp-element-button::before {
  content: "\f023";
  font-family: fontawesome;
  margin-right: 0.5rem;
}

/* === SITE LOGO & TITLE === */
.wp-block-site-logo img {
	min-height: 50px;
}

.wp-block-site-title {
	margin: 0 !important;
	line-height: 1em;
}

/* === BUTTONS === */
.wp-block-buttons {
	margin-top: var(--spacing-base);
}

.wp-block-button {
	margin-top: var(--spacing-base) !important;
}

.wp-block-buttons>.wp-block-button {
	display: inline-block !important;
}

.wp-block-button .wp-element-button {
	transition: var(--transition-base);
}

.wp-block-button .wp-element-button:hover {
	box-shadow: 0 10px 20px -10px rgba(0, 0, 0, 0.3);
}

.wp-block-button.is-style-fill .wp-element-button:hover {
	background-color: transparent !important;
	color: var(--wp--preset--color--custom-button-background) !important;
	border-color: var(--wp--preset--color--custom-button-background) !important;
}

.wp-block-button.is-style-outline .wp-element-button:hover {
	background-color: var(--wp--preset--color--custom-text) !important;
	color: var(--wp--preset--color--white) !important;
	border-color: var(--wp--preset--color--custom-text) !important;
}

/* === FORMS === */
.wpcf7-inline-wrapper {
	display: flex;
	flex-flow: row nowrap;
	gap: var(--spacing-base);
	margin-top: var(--spacing-base);
}

.wpcf7-inline-field {
	flex: 1 1 auto;
	margin: 0;
}

.wpcf7-form-control-wrap,
.wpcf7-form-control {
	width: 100%;
}

.wpcf7-acceptance {
	font-size: 0.9rem;
}

input:not([type="checkbox"]),
textarea {
	padding: 16px 27px;
	border: none;
	background-color: #f7f7f7;
	font-family: 'Outfit', sans-serif;
	font-size: 1rem;
	font-weight: 400;
	color: var(--wp--preset--color--custom-text);
	opacity: 1;
	border-radius: var(--border-radius-base);
}

input:focus-visible,
textarea:focus-visible {
	outline-color: var(--wp--preset--color--custom-text);
}

::placeholder {
	font-family: 'Outfit', sans-serif;
	font-size: 1rem;
	font-weight: 400;
	color: var(--wp--preset--color--custom-text);
	opacity: 0.67;
}

/* === SEPARATORS === */
.wp-block-separator {
	margin: var(--spacing-base) 0 !important;
	border-top: 2px groove #ffffff2b;
}

/* === DETAILS === */
details>summary {
	font-size: 27px;
	font-weight: 600;
}

details>summary:first-of-type {
	list-style: none;
}

/* === WORDPRESS BLOCKS === */
:where(.wp-block-columns) {
	margin-bottom: 0 !important;
}

.wp-site-blocks>.entry-content {
	min-height: 100vh;
}

.wp-block-query {
	position: relative;
}

.wp-block-column>*:first-child,
.wp-block-group:not(.is-horizontal)>*:first-child {
	margin-top: 0 !important;
}

article .text>*:first-child {
	margin-top: 0 !important;
}

article {
	height: 100%;
}

/* === MEDIA & IMAGES === */
img,
video,
iframe {
	max-width: 100%;
	height: auto;
}


.glassmorphism img {
	mix-blend-mode: screen;
}

body.single-post .wp-block-image img {
	display: block;
	margin: var(--spacing-large) 0;
	border-radius: var(--spacing-base);
	box-shadow: 0px 70px 100px -40px rgba(0, 0, 0, 0.5) !important;
}

[style*="border-radius"],
[style*="box-shadow"] {
	overflow: hidden;
}

[style*="box-shadow"] {
	box-shadow: var(--wp--preset--shadow--shadow-1) !important;
}

img.wp-image-74848 {
	filter: drop-shadow(0px 2px 3px rgba(0, 0, 0, 0.5));
}

/* === SPECIAL SECTIONS === */
section.members .wp-block-post-title a,
section.members .wp-block-post-excerpt__excerpt {
	width: 100%;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.entry-content section {
	padding: 4rem var(--spacing-large);
}

main {
	overflow-x: hidden;
	width: 100%;
}

body.home main section:first-child {
	border-top: none;
}

.why-cssma .wp-block-cover img {
	object-fit: contain;
	object-position: right center;
	padding: var(--spacing-large);
}

.why-cssma img.wp-block-cover__image-background {
	aspect-ratio: 1 / 1 !important;
	object-fit: contain !important;
	padding: var(--spacing-large) !important;
	object-position: center right !important;
}

/* === SPECIAL EFFECTS === */
.has-custom-accent-gradient-background {
	backdrop-filter: blur(6px) !important;
	box-shadow: 0px 0px 4px 0px #e86e2533 inset, 0px 0px 100px 10px #e86e251a inset !important;
}

.custom-shape-divider-bottom-1757682540 .shape-fill {
	fill: var(--wp--preset--color--white);
}

/* === GLASSMORPHISM === */
.glassmorphism {
	background: var(--glassmorphism-gradient) !important;
	backdrop-filter: var(--glassmorphism-blur) !important;
	-webkit-backdrop-filter: var(--glassmorphism-blur) !important;
	border: var(--glassmorphism-border) !important;
	border-top: var(--glassmorphism-border-highlight) !important;
	border-left: var(--glassmorphism-border-highlight) !important;
	border-radius: var(--border-radius-large) !important;
	box-shadow: var(--glassmorphism-shadow) !important;
	transition:
		background var(--transition-smooth),
		box-shadow var(--transition-smooth),
		border-color var(--transition-smooth) !important;
	overflow: hidden !important;
}

.glassmorphism:hover {
	background: var(--glassmorphism-gradient-hover);
	border-color: rgba(255, 255, 255, 0.3);
	box-shadow: var(--glassmorphism-shadow-hover);
	transition:
		background var(--transition-smooth),
		box-shadow var(--transition-smooth),
		border-color var(--transition-smooth);
}

/* === FONTAWESOME === */
.fa,
.has-fontawesome-font-family {
	display: inline-block;
	font: normal normal normal 14px / 1 FontAwesome;
	font-size: inherit;
	text-rendering: auto;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

.fa-fw {
	width: 1.28571429em;
	text-align: center;
}

/* === MEDIA QUERIES === */

/* Mobile: max-width 600px */
@media (max-width: 600px) {
	html {
		font-size: 14px;
	}

	#wpadminbar {
		position: fixed;
	}

	html body.admin-bar :where(.is-position-sticky) {
		--wp-admin--admin-bar--position-offset: 46px;
	}

	.has-ethnocentric-font-family {
		font-size: 1.5rem !important;
	}
}

/* Tablet: max-width 781px */
@media (max-width: 781px) {
	.wpcf7-inline-wrapper {
		flex-wrap: wrap;
	}
}

/* Navigation breakpoint: max-width 960px */
@media (max-width: 960px) {
	.wp-block-navigation__responsive-container-open:not(.always-shown) {
		display: flex !important;
	}

	.wp-block-navigation__responsive-container:not(.hidden-by-default):not(.is-menu-open) {
		bottom: 0 !important;
		display: none !important;
		left: 0 !important;
		position: fixed !important;
		right: 0 !important;
		top: 0 !important;
	}

	.wp-block-navigation__responsive-container.is-menu-open {
		height: 100vh !important;
		max-height: 100vh !important;
		overflow-y: auto !important;
		padding: 0 !important;
		background-color: transparent !important;
		background: transparent !important;
	}

	.wp-block-navigation__responsive-container.is-menu-open {
		position: relative;
	}

	.wp-block-navigation__responsive-container.is-menu-open::before {
		content: '';
		position: fixed;
		top: 0;
		left: 0;
		right: 0;
		bottom: 0;
		pointer-events: none;
		z-index: 999998;
	}

	div#modal-1 {
		padding: var(--spacing-large);
		height: 100% !important;
		min-height: 100vh !important;
		position: fixed !important;
		top: 0 !important;
		left: 0 !important;
		width: 100% !important;
		z-index: 999999 !important;
		padding: 1rem 2rem !important;
		background: #181221 !important;
	}

	.wp-block-navigation__responsive-close {
		backdrop-filter: none !important;
		-webkit-backdrop-filter: none !important;
	}

	.wp-block-navigation__responsive-dialog {
		padding: var(--spacing-large) !important;
		background: var(--glassmorphism-gradient) !important;
		border: var(--glassmorphism-border) !important;
		border-top: var(--glassmorphism-border-highlight) !important;
		border-left: var(--glassmorphism-border-highlight) !important;
		border-radius: var(--border-radius-large) !important;
		box-shadow: var(--glassmorphism-shadow) !important;
	}

	.wp-block-navigation__responsive-container-content {
		background-color: transparent !important;
		background: transparent !important;
		backdrop-filter: none !important;
		-webkit-backdrop-filter: none !important;
	}

	.wp-block-navigation__responsive-container-content {
		padding-top: var(--spacing-base) !important;
	}
}

/* Desktop: min-width 961px */
@media (min-width: 961px) {
	.wp-block-navigation__responsive-container-open:not(.always-shown) {
		display: none !important;
	}

	.wp-block-navigation__responsive-container:not(.hidden-by-default):not(.is-menu-open) {
		background-color: inherit !important;
		display: block !important;
		position: relative !important;
		width: 100% !important;
		z-index: auto !important;
	}
}

/* Tablet to Desktop: 600px - 1200px */
@media (min-width: 600px) and (max-width: 1200px) {
	.wp-block-post-template-is-layout-grid {
		grid-template-columns: 1fr 1fr;
	}
}