/*
Theme Name: Monceau
Theme URI: https://monceau.ascapital-consulting.com/
Author: AS Capital Consulting
Author URI: https://ascapital-consulting.com/
Description: Monceau is an elegant multipurpose block theme for consultancies, agencies, boutiques, schools and studios. It ships with five ready-made websites, sixty-plus sections, six style variations, five headers, four footers, WooCommerce templates and full support for the WordPress site editor — no page builder required.
Requires at least: 6.6
Tested up to: 7.1
Requires PHP: 7.4
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: monceau
Tags: one-column, two-columns, three-columns, block-patterns, block-styles, custom-colors, custom-logo, custom-menu, editor-style, featured-images, full-site-editing, full-width-template, rtl-language-support, style-variations, sticky-post, threaded-comments, translation-ready, wide-blocks, e-commerce, portfolio, blog
*/

/* ------------------------------------------------------------------ Base */
:root {
	--monceau-ease: cubic-bezier(0.2, 0.7, 0.2, 1);
}

html {
	-webkit-text-size-adjust: 100%;
	scroll-behavior: smooth;
}

body {
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	text-rendering: optimizeLegibility;
	font-kerning: normal;
}

::selection {
	background: var(--wp--preset--color--accent-2);
	color: var(--wp--preset--color--base);
}

a {
	text-decoration-thickness: 1px;
	text-underline-offset: 0.22em;
	transition: color var(--wp--custom--transition), text-decoration-color var(--wp--custom--transition);
}

:where(a, button, input, select, textarea, summary):focus-visible {
	outline: 2px solid var(--wp--preset--color--accent-2);
	outline-offset: 3px;
}

/* ------------------------------------------------------------------ Buttons */
.wp-element-button,
.wp-block-button__link {
	transition: background-color var(--wp--custom--transition), color var(--wp--custom--transition),
		border-color var(--wp--custom--transition), transform var(--wp--custom--transition);
}

.wp-block-button.is-style-outline > .wp-block-button__link:hover,
.wp-block-button.is-style-outline > .wp-block-button__link:focus-visible {
	background-color: var(--wp--preset--color--contrast);
	border-color: var(--wp--preset--color--contrast);
	color: var(--wp--preset--color--base);
}

.has-accent-3-background-color .wp-block-button.is-style-outline > .wp-block-button__link:hover,
.has-accent-background-color .wp-block-button.is-style-outline > .wp-block-button__link:hover,
.monceau-on-dark .wp-block-button.is-style-outline > .wp-block-button__link:hover,
.wp-block-cover .wp-block-button.is-style-outline > .wp-block-button__link:hover {
	background-color: var(--wp--preset--color--light);
	border-color: var(--wp--preset--color--light);
	color: var(--wp--preset--color--dark);
}

/* Lien texte avec flèche */
.wp-block-button.is-style-monceau-text-link > .wp-block-button__link {
	background: none;
	border: 0;
	border-bottom: 1px solid currentColor;
	border-radius: 0;
	color: inherit;
	padding: 0 0 0.35em;
}

.wp-block-button.is-style-monceau-text-link > .wp-block-button__link::after {
	content: "\2192";
	display: inline-block;
	margin-inline-start: 0.6em;
	transition: transform var(--wp--custom--transition);
}

.wp-block-button.is-style-monceau-text-link > .wp-block-button__link:hover {
	background: none;
	color: var(--monceau-accent-text);
}

.wp-block-button.is-style-monceau-text-link > .wp-block-button__link:hover::after {
	transform: translateX(4px);
}

.rtl .wp-block-button.is-style-monceau-text-link > .wp-block-button__link::after {
	content: "\2190";
}

.rtl .wp-block-button.is-style-monceau-text-link > .wp-block-button__link:hover::after {
	transform: translateX(-4px);
}

/* ------------------------------------------------------------------ Headers */
.monceau-header {
	position: relative;
	z-index: 20;
}

.monceau-header .wp-block-navigation .wp-block-navigation-item__content {
	background-image: linear-gradient(currentColor, currentColor);
	background-position: 0 100%;
	background-repeat: no-repeat;
	background-size: 0 1px;
	padding-bottom: 0.3em;
	transition: background-size var(--wp--custom--transition);
}

.monceau-header .wp-block-navigation .wp-block-navigation-item__content:hover,
.monceau-header .wp-block-navigation .current-menu-item > .wp-block-navigation-item__content {
	background-size: 100% 1px;
}

.monceau-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content {
	font-size: var(--wp--preset--font-size--large);
	letter-spacing: 0.04em;
}

/* En-tête transparent posé sur la première section */
.monceau-header--overlay {
	background: transparent;
	color: var(--wp--preset--color--light);
	inset-inline: 0;
	position: absolute;
	top: 0;
}

.monceau-header--overlay .wp-block-site-title a,
.monceau-header--overlay .wp-block-navigation,
.monceau-header--overlay .wp-block-navigation-item__content {
	color: var(--wp--preset--color--light);
}

.monceau-header--overlay .wp-block-navigation__responsive-container.is-menu-open,
.monceau-header--overlay .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content {
	color: var(--wp--preset--color--contrast);
}

.admin-bar .monceau-header--overlay {
	top: var(--wp-admin--admin-bar--height, 32px);
}

.monceau-page-overlay .wp-site-blocks > main,
.monceau-page-overlay .wp-site-blocks > .wp-block-group:first-child {
	margin-block-start: 0;
}

/* Filet fin sous l'en-tête */
.monceau-header--ruled {
	border-bottom: 1px solid var(--wp--preset--color--border);
}

/* ------------------------------------------------------------------ Block styles */
/* Sur-titre : petites capitales espacées précédées d'un filet */
.is-style-monceau-eyebrow {
	color: var(--monceau-accent-text);
	font-family: var(--wp--custom--font--body);
	font-size: var(--wp--preset--font-size--x-small);
	font-weight: 600;
	letter-spacing: var(--wp--custom--eyebrow--tracking);
	line-height: 1.4;
	text-transform: uppercase;
}

.is-style-monceau-eyebrow::before {
	background: currentColor;
	content: "";
	display: inline-block;
	height: 1px;
	margin-inline-end: 1em;
	vertical-align: middle;
	width: 2.5em;
}

.is-style-monceau-eyebrow.has-text-align-center::after {
	background: currentColor;
	content: "";
	display: inline-block;
	height: 1px;
	margin-inline-start: 1em;
	vertical-align: middle;
	width: 2.5em;
}

/* Titre d'affichage */
.wp-block-heading.is-style-monceau-display {
	font-size: var(--wp--preset--font-size--display);
	letter-spacing: -0.025em;
	line-height: 0.98;
}

/* Paragraphe d'introduction */
.is-style-monceau-lead {
	font-family: var(--wp--custom--font--heading);
	font-size: var(--wp--preset--font-size--large);
	line-height: 1.5;
}

/* Filet ornemental doré */
.wp-block-separator.is-style-monceau-ornament {
	border: 0;
	border-top: 1px solid var(--wp--preset--color--accent-2);
	color: var(--wp--preset--color--accent-2);
	margin-inline: 0;
	opacity: 1;
	width: 4rem;
}

.wp-block-separator.is-style-monceau-ornament.aligncenter,
.has-text-align-center + .wp-block-separator.is-style-monceau-ornament {
	margin-inline: auto;
}

/* Image encadrée d'un filet doré décalé */
.wp-block-image.is-style-monceau-frame img,
.wp-block-post-featured-image.is-style-monceau-frame img {
	box-shadow: 18px 18px 0 -1px var(--wp--preset--color--base), 18px 18px 0 0 var(--wp--preset--color--accent-2);
}

.rtl .wp-block-image.is-style-monceau-frame img {
	box-shadow: -18px 18px 0 -1px var(--wp--preset--color--base), -18px 18px 0 0 var(--wp--preset--color--accent-2);
}

/* Image en arche */
.wp-block-image.is-style-monceau-arch img {
	border-radius: 999px 999px 0 0;
}

/* Carte */
.wp-block-group.is-style-monceau-card {
	background-color: var(--wp--preset--color--base);
	border: 1px solid var(--wp--preset--color--border);
	border-radius: var(--wp--custom--radius--card);
	transition: box-shadow var(--wp--custom--transition), transform var(--wp--custom--transition);
}

.wp-block-group.is-style-monceau-card:hover {
	box-shadow: var(--wp--preset--shadow--soft);
	transform: translateY(-3px);
}

/* Liste à puces fines */
.wp-block-list.is-style-monceau-checks {
	list-style: none;
	padding-inline-start: 0;
}

.wp-block-list.is-style-monceau-checks li {
	padding-inline-start: 1.8em;
	position: relative;
}

.wp-block-list.is-style-monceau-checks li + li {
	margin-top: 0.6em;
}

.wp-block-list.is-style-monceau-checks li::before {
	/* The tick is a drawn glyph: physical borders keep it the same way round in right-to-left languages. */
	border-bottom: 1px solid var(--wp--preset--color--accent-2);
	border-right: 1px solid var(--wp--preset--color--accent-2);
	content: "";
	height: 0.7em;
	inset-inline-start: 0.2em;
	position: absolute;
	top: 0.35em;
	transform: rotate(45deg);
	width: 0.38em;
}

/* ------------------------------------------------------------------ Posts */
.wp-block-post-featured-image {
	overflow: hidden;
}

.wp-block-post-featured-image img {
	transition: transform 900ms var(--monceau-ease);
}

.wp-block-post-featured-image a:hover img {
	transform: scale(1.04);
}

.monceau-post-meta > * {
	margin: 0;
}

.monceau-post-meta .wp-block-post-terms__separator {
	opacity: 0.6;
}

/* Grand chiffre de la page 404 */
.monceau-404-number {
	font-family: var(--wp--custom--font--heading);
	font-size: clamp(7rem, 22vw, 16rem);
	font-weight: 300;
	letter-spacing: -0.04em;
	line-height: 0.85;
}

/* ------------------------------------------------------------------ Forms */
.wp-block-search__input,
.wp-block-post-comments-form input:not([type="submit"]):not([type="checkbox"]),
.wp-block-post-comments-form textarea {
	background: var(--wp--preset--color--base);
	border: 1px solid var(--wp--preset--color--border);
	border-radius: 0;
	color: var(--wp--preset--color--contrast);
	padding: 0.9em 1em;
}

.wp-block-search__input:focus,
.wp-block-post-comments-form input:focus,
.wp-block-post-comments-form textarea:focus {
	border-color: var(--wp--preset--color--accent-2);
	outline: none;
}

/* ------------------------------------------------------------------ Quotes, tables, captions */
.wp-block-quote cite,
.wp-block-pullquote cite,
.wp-block-quote .wp-block-quote__citation,
.wp-block-pullquote .wp-block-pullquote__citation {
	color: var(--wp--preset--color--contrast-2);
	display: block;
	font-family: var(--wp--custom--font--body);
	font-size: var(--wp--preset--font-size--x-small);
	font-style: normal;
	font-weight: 600;
	letter-spacing: 0.16em;
	margin-top: 1rem;
	text-transform: uppercase;
}

.wp-block-pullquote {
	border-bottom: 1px solid var(--wp--preset--color--accent-2);
	border-top: 1px solid var(--wp--preset--color--accent-2);
}

.wp-block-table table {
	border-collapse: collapse;
}

.wp-block-table th,
.wp-block-table td {
	border: 0;
	border-bottom: 1px solid var(--wp--preset--color--border);
	padding: 0.85em 1em;
	text-align: start;
}

.wp-block-table thead {
	border-bottom: 1px solid var(--wp--preset--color--contrast);
}

.wp-block-table th {
	font-size: var(--wp--preset--font-size--x-small);
	font-weight: 600;
	letter-spacing: 0.14em;
	text-transform: uppercase;
}

.wp-block-image.is-style-monceau-frame figcaption {
	margin-top: calc(18px + 0.75rem);
}

/* En-têtes : pas de retour à la ligne dans le menu ni dans le bouton */
.monceau-header .wp-element-button {
	white-space: nowrap;
}

.monceau-header .wp-block-navigation__container {
	flex-wrap: nowrap;
}

/* Couverture : le contenu positionné (ex. en bas à gauche) s'aligne sur la grille du site */
.wp-block-cover.has-custom-content-position.has-custom-content-position .wp-block-cover__inner-container.is-layout-constrained {
	width: 100%;
}

/* Texte sur photographie sombre : clair par défaut */
.wp-block-cover:not(.is-light) {
	color: var(--wp--preset--color--light);
}

.wp-block-cover:not(.is-light) .wp-block-heading:not(.has-text-color):not(.has-background .wp-block-heading),
.wp-block-cover:not(.is-light) .wp-block-site-title a {
	color: var(--wp--preset--color--light);
}

.monceau-on-dark .has-contrast-2-color {
	color: var(--monceau-muted) !important;
}

/* Piles verticales : les éléments structurants prennent toute la largeur */
.wp-block-group.is-layout-flex.is-vertical > :is(.wp-block-columns, .wp-block-separator, .wp-block-details, .wp-block-table, .wp-block-buttons, .wp-block-list, .wp-block-image, .wp-block-group) {
	align-self: stretch;
}

.wp-block-group.is-layout-flex.is-vertical > .wp-block-separator.is-style-monceau-ornament {
	align-self: flex-start;
}

/* Cartes d'une même rangée : même hauteur */
.wp-block-column > .wp-block-group.is-style-monceau-card:only-child,
.wp-block-column > .wp-block-group.has-border-color:only-child {
	height: 100%;
}

/* Questions dépliables : signe + élégant */
.wp-block-details summary {
	cursor: pointer;
	font-weight: 500;
	list-style: none;
	padding-inline-end: 2rem;
	position: relative;
}

.wp-block-details summary::-webkit-details-marker {
	display: none;
}

.wp-block-details summary::after {
	color: var(--wp--preset--color--accent-2);
	content: "+";
	font-family: var(--wp--custom--font--heading);
	font-size: 1.5em;
	inset-inline-end: 0.25rem;
	line-height: 1;
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	transition: transform var(--wp--custom--transition);
}

.wp-block-details[open] summary::after {
	transform: translateY(-50%) rotate(45deg);
}

.wp-block-details > :not(summary) {
	margin-top: 0.75rem;
}

/* ------------------------------------------------------------------ Motion */
@media (prefers-reduced-motion: reduce) {
	html {
		scroll-behavior: auto;
	}

	*,
	*::before,
	*::after {
		animation-duration: 0.01ms !important;
		transition-duration: 0.01ms !important;
	}
}

/* ------------------------------------------------------------------ Utilities */
@media (max-width: 781px) {
	.monceau-hide-mobile {
		display: none !important;
	}
}

.monceau-muted,
.monceau-legal {
	color: var(--wp--preset--color--contrast-2);
}

.monceau-on-dark {
	--monceau-muted: color-mix(in srgb, var(--wp--preset--color--light) 66%, transparent);
}

.monceau-on-dark .monceau-muted,
.monceau-on-dark .wp-block-list a,
.monceau-on-dark .monceau-legal {
	color: var(--monceau-muted);
}

.monceau-on-dark .wp-block-list a:hover,
.monceau-on-dark .monceau-legal a:hover {
	color: var(--wp--preset--color--light);
}

.monceau-on-dark .wp-block-site-title a,
.monceau-on-dark .wp-block-heading,
.monceau-on-dark .wp-block-post-title,
.monceau-on-dark .wp-block-post-title a {
	color: var(--wp--preset--color--light);
}

.monceau-on-dark .wp-block-post-date,
.monceau-on-dark .wp-block-post-author-name {
	color: var(--monceau-muted);
}

.monceau-on-dark .wp-block-separator {
	border-color: color-mix(in srgb, var(--wp--preset--color--light) 16%, transparent);
	color: color-mix(in srgb, var(--wp--preset--color--light) 16%, transparent);
}

.monceau-footer-links {
	list-style: none;
	padding-inline-start: 0;
}

.monceau-footer-links li + li {
	margin-top: 0.55em;
}

.monceau-footer-links a {
	text-decoration: none;
}

.monceau-social .wp-social-link,
.monceau-social.is-style-logos-only .wp-social-link {
	color: currentColor;
}

.monceau-social.is-style-logos-only .wp-social-link svg {
	fill: currentColor;
}

.monceau-social .wp-social-link a:hover {
	opacity: 0.7;
}

/* Full-width sections sit flush against each other and against the footer (no strip of page colour). */
.wp-block-post-content > .alignfull + .alignfull,
.wp-site-blocks > header.wp-block-template-part + *,
.wp-site-blocks > footer.wp-block-template-part {
	margin-block-start: 0;
}

/* Split header on phones: menu button, centred name on one line, no appointment link. */
@media (max-width: 781px) {
	.monceau-header--split .wp-block-columns > .wp-block-column:first-child,
	.monceau-header--split .wp-block-columns > .wp-block-column:last-child {
		flex: 0 0 2.5rem !important;
	}

	.monceau-header--split .wp-block-columns > .wp-block-column:nth-child(2) {
		flex: 1 1 auto !important;
	}

	.monceau-header--split .wp-block-site-title {
		white-space: nowrap;
	}
}

/* ------------------------------------------------------------------ Gold text that stays legible */
/*
 * The metal accent is kept for rules, frames and ornaments. Small text in that colour is mixed with
 * the text colour of its section, so that it keeps the gold tint and still reaches a 4.5:1 contrast
 * (WCAG AA): darker on light backgrounds, lighter on dark ones.
 */
body {
	--monceau-accent-text: color-mix(in srgb, var(--wp--preset--color--accent-2) 60%, var(--wp--preset--color--contrast));
}

.monceau-on-dark,
.monceau-dark-products,
.monceau-header--overlay,
.wp-block-cover,
.has-accent-background-color,
.has-accent-3-background-color,
.has-contrast-background-color,
.has-dark-background-color {
	--monceau-accent-text: color-mix(in srgb, var(--wp--preset--color--accent-2) 60%, var(--wp--preset--color--light));
}

/* A light card placed on a dark section or a cover goes back to the text colour of the page. */
.has-base-background-color,
.has-base-2-background-color {
	--monceau-accent-text: color-mix(in srgb, var(--wp--preset--color--accent-2) 60%, var(--wp--preset--color--contrast));
}

.has-light-background-color {
	--monceau-accent-text: color-mix(in srgb, var(--wp--preset--color--accent-2) 60%, var(--wp--preset--color--dark));
}

.has-accent-2-color.has-accent-2-color {
	color: var(--monceau-accent-text) !important;
}

/* Footer column titles: second-level headings, styled small. */
.wp-block-heading.monceau-footer-heading {
	font-family: var(--wp--custom--font--body);
	font-size: var(--wp--preset--font-size--x-small);
	font-weight: 600;
	letter-spacing: 0.18em;
	line-height: 1.4;
	text-transform: uppercase;
}

/* ------------------------------------------------------------------ Arabic and Chinese */
/* Letter-spacing breaks the joined letters of Arabic: the eyebrows, buttons and menus keep their size without it. */
html:lang(ar) body * {
	letter-spacing: 0 !important;
}

html:lang(ar) :is(h1, h2, h3, h4, h5, h6, .wp-block-site-title, .wp-block-post-title, .wp-block-query-title),
html:lang(ar) .is-style-monceau-display {
	line-height: 1.4 !important;
}

html:lang(ar) body {
	line-height: 1.85;
}

html:lang(zh) :is(h1, h2, h3, h4, h5, h6, .wp-block-post-title, .wp-block-query-title),
html:lang(zh) .is-style-monceau-display {
	letter-spacing: 0.02em;
	line-height: 1.3 !important;
}

/* Phone numbers and other left-to-right runs keep their order inside right-to-left text. */
[dir="rtl"] a[href^="tel:"],
[dir="rtl"] a[href^="mailto:"] {
	direction: ltr;
	unicode-bidi: isolate;
}

/* Content pinned to the left by the layout settings follows the reading direction in right-to-left languages. */
[dir="rtl"] .is-layout-constrained.is-content-justification-left > :where(:not(.alignleft):not(.alignright):not(.alignfull)) {
	margin-left: auto !important;
	margin-right: 0 !important;
}

[dir="rtl"] .is-layout-constrained.is-content-justification-right > :where(:not(.alignleft):not(.alignright):not(.alignfull)) {
	margin-left: 0 !important;
	margin-right: auto !important;
}
