/*
 * Mahymedia Base — styles structurels.
 * Les couleurs et polices viennent des variables de theme.json (--wp--preset--*)
 * et des variables --mm-* ci-dessous, que le thème enfant redéfinit.
 */

:root {
	--mm-color-text: var(--wp--preset--color--texte, #1e1e1e);
	--mm-color-heading: var(--wp--preset--color--titre, #1e1e1e);
	--mm-color-brand: var(--wp--preset--color--marque, #1e1e1e);
	--mm-color-accent: var(--wp--preset--color--accent, #1e1e1e);
	--mm-color-bg: var(--wp--preset--color--fond, #fff);
	--mm-color-bg-alt: var(--wp--preset--color--fond-alt, #f6f6f6);
	--mm-color-line: var(--wp--preset--color--ligne, #ddd);
	--mm-color-muted: var(--wp--preset--color--gris, #777);
	--mm-font-body: var(--wp--preset--font-family--texte, system-ui, sans-serif);
	--mm-font-heading: var(--wp--preset--font-family--titre, Georgia, serif);
	--mm-container: 1600px;
	--mm-gutter: clamp(16px, 4vw, 64px);
	--mm-section: clamp(56px, 8vw, 120px);
	--mm-header-height: 45px;
	--mm-topbar-height: 0px;
	--mm-transition: .3s ease;
}

/* ---------- Base ---------- */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-padding-top: calc(var(--mm-header-height) + 16px); }
body { margin: 0; background: var(--mm-color-bg); color: var(--mm-color-text); font-family: var(--mm-font-body); -webkit-font-smoothing: antialiased; overflow-x: hidden; }
img, svg, video { max-width: 100%; height: auto; }
img { display: block; }
a { color: inherit; }
:focus-visible { outline: 2px solid var(--mm-color-accent); outline-offset: 3px; }
.mm-main:focus { outline: none; }

.screen-reader-text { border: 0; clip: rect(1px,1px,1px,1px); clip-path: inset(50%); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute !important; width: 1px; word-wrap: normal !important; }
.mm-skip-link:focus { clip: auto; clip-path: none; height: auto; width: auto; left: 8px; top: 8px; z-index: 100000; padding: 12px 16px; background: #fff; color: #000; }

.mm-icon { width: 1em; height: 1em; fill: currentColor; flex: none; }

/* ---------- Conteneurs ---------- */
.mm-container { width: 100%; max-width: var(--mm-container); margin-inline: auto; padding-inline: var(--mm-gutter); }
.mm-section { padding-block: var(--mm-section); }

/* Contenu en blocs : largeur de lecture, alignwide / alignfull gérés */
.mm-content { padding-inline: var(--mm-gutter); }
.mm-content > * { max-width: var(--wp--style--global--content-size, 760px); margin-inline: auto; }
.mm-content > .alignwide { max-width: var(--wp--style--global--wide-size, 1280px); }
.mm-content > .alignfull { max-width: none; margin-inline: calc(-1 * var(--mm-gutter)); }
.mm-content--full { padding-inline: 0; }
.mm-content--full > * { max-width: none; margin-block: 0; }
.mm-content--full > :not(.alignfull):not(.alignwide):not([class*="em-"]):not([class*="mm-"]) { max-width: var(--wp--style--global--content-size, 760px); margin-inline: auto; padding-inline: var(--mm-gutter); }
.mm-content--full > .alignwide { max-width: var(--wp--style--global--wide-size, 1280px); margin-inline: auto; padding-inline: var(--mm-gutter); }
.mm-content--full > .alignfull { margin-inline: 0; }
.mm-entry { padding-bottom: var(--mm-section); }
.mm-entry--full { padding-bottom: 0; }

/* ---------- En-tête ---------- */
.mm-header { position: sticky; top: 0; z-index: 90; }
.admin-bar .mm-header { top: var(--wp-admin--admin-bar--height, 32px); }
@media (max-width: 600px) { .admin-bar .mm-header { top: 0; } }
.mm-topbar { background: var(--mm-color-brand); color: #fff; }
.mm-topbar__list { list-style: none; margin: 0; padding: 0 var(--mm-gutter); min-height: 45px; display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 8px 50px; }
.mm-topbar a { color: inherit; text-decoration: none; display: inline-flex; align-items: center; gap: 14px; }
.mm-topbar .mm-icon { width: 13px; height: 13px; }

.mm-navbar { background: #fff; }
.mm-navbar__inner { min-height: var(--mm-header-height); padding-inline: 4%; display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.mm-brand img { max-height: 60px; width: auto; }
.mm-brand__name { font-family: var(--mm-font-heading); text-decoration: none; font-size: 1.25rem; }

.mm-nav { display: flex; align-items: center; }
.mm-nav__menu { list-style: none; margin: 0; padding: 0; display: flex; align-items: center; gap: 0 60px; }
.mm-nav__menu a { display: block; padding: 4px 0; text-decoration: none; transition: color var(--mm-transition); }
.mm-nav__menu .sub-menu { list-style: none; margin: 0; padding: 8px 0; position: absolute; min-width: 220px; background: #fff; box-shadow: 0 10px 30px rgba(0,0,0,.08); opacity: 0; visibility: hidden; transform: translateY(6px); transition: opacity var(--mm-transition), transform var(--mm-transition), visibility var(--mm-transition); }
.mm-nav__menu .sub-menu a { padding: 10px 20px; }
.mm-nav__menu li { position: relative; }
.mm-nav__menu li:hover > .sub-menu, .mm-nav__menu li:focus-within > .sub-menu { opacity: 1; visibility: visible; transform: none; }
.mm-nav__toggle { display: none; background: none; border: 0; padding: 10px; cursor: pointer; color: inherit; font-size: 22px; line-height: 0; }
.mm-nav__icon-close { display: none; }

@media (max-width: 1024px) {
	.mm-nav__toggle { display: inline-flex; }
	.mm-nav__menu { display: none; position: absolute; left: 0; right: 0; top: 100%; flex-direction: column; align-items: stretch; gap: 0; background: #fff; box-shadow: 0 12px 30px rgba(0,0,0,.08); max-height: calc(100vh - 120px); overflow-y: auto; }
	.mm-nav.is-open .mm-nav__menu { display: flex; }
	.mm-nav.is-open .mm-nav__icon-open { display: none; }
	.mm-nav.is-open .mm-nav__icon-close { display: block; }
	.mm-nav__menu > li { border-bottom: 1px solid var(--mm-color-line); }
	.mm-nav__menu a { padding: 17px var(--mm-gutter); }
	.mm-nav__menu .sub-menu { position: static; opacity: 1; visibility: visible; transform: none; box-shadow: none; padding: 0 0 8px 16px; }
	.mm-navbar__inner { position: relative; }
}

/* ---------- Burger signature « ME / NU » (animation « Pivot ») ----------
 * Réglages pour un thème enfant :
 *   --mm-burger-size  taille du bouton (44px)
 *   --mm-burger-trait épaisseur de la croix (1.5px)
 *   --mm-burger-close couleur de la croix (couleur du texte par défaut)
 */
.mm-nav__toggle--signature { width: var(--mm-burger-size, 44px); height: var(--mm-burger-size, 44px); padding: 6px; border-radius: 10px; font-size: 0; }
.mm-burger { width: 100%; height: 100%; overflow: visible; display: block; }
.mm-burger__l { fill: currentColor; transform-box: view-box; transform-origin: 50% 50%; transition: transform .5s cubic-bezier(.7, 0, .3, 1), opacity .35s ease; }
.mm-burger__x { transform-box: view-box; transform-origin: 50% 50%; transform: rotate(-90deg) scale(.25); opacity: 0; transition: transform .7s cubic-bezier(.34, 1.56, .64, 1), opacity .25s ease; }
.mm-burger__x path { fill: none; stroke: var(--mm-burger-close, currentColor); stroke-width: var(--mm-burger-trait, 1.5px); vector-effect: non-scaling-stroke; stroke-linecap: round; }
/* Survol : les lettres « respirent » */
.mm-nav:not(.is-open) .mm-nav__toggle--signature:hover .mm-burger__l--m { transform: translate(-3.5%, -3.5%); }
.mm-nav:not(.is-open) .mm-nav__toggle--signature:hover .mm-burger__l--e { transform: translate(3.5%, -3.5%); }
.mm-nav:not(.is-open) .mm-nav__toggle--signature:hover .mm-burger__l--n { transform: translate(-3.5%, 3.5%); }
.mm-nav:not(.is-open) .mm-nav__toggle--signature:hover .mm-burger__l--u { transform: translate(3.5%, 3.5%); }
/* Ouvert : les lettres partent vers les coins, le « + » pivote en « × » */
.mm-nav.is-open .mm-burger__l { opacity: 0; }
.mm-nav.is-open .mm-burger__l--m { transform: translate(-24%, -24%) scale(.35); }
.mm-nav.is-open .mm-burger__l--e { transform: translate(24%, -24%) scale(.35); }
.mm-nav.is-open .mm-burger__l--n { transform: translate(-24%, 24%) scale(.35); }
.mm-nav.is-open .mm-burger__l--u { transform: translate(24%, 24%) scale(.35); }
.mm-nav.is-open .mm-burger__x { transform: rotate(45deg) scale(1); opacity: 1; transition-delay: .12s; }
.mm-nav.is-closing .mm-burger__l { transition-delay: .15s; }
@media (prefers-reduced-motion: reduce) {
	.mm-burger__l, .mm-burger__x { transition: none !important; }
}

/* ---------- Boutons texte + flèche ---------- */
.mm-button { display: inline-flex; align-items: center; gap: 10px; padding: 8px 15px; text-decoration: none; transition: color var(--mm-transition); }
.mm-button__icon { display: inline-flex; }

/* ---------- Pages ---------- */
.mm-page-header { padding-block: clamp(48px, 7vw, 96px) clamp(24px, 4vw, 48px); text-align: center; }
.mm-page-title { margin: 0; }
.mm-page-intro { max-width: 760px; margin: 16px auto 0; }
.mm-entry__media img { width: 100%; height: auto; }

/* Liste d'articles */
.mm-post-list { display: grid; gap: 40px; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); }
.mm-card__media img { width: 100%; aspect-ratio: 4 / 5; object-fit: cover; }
.mm-card__title a { text-decoration: none; }

.navigation.pagination { margin-top: 48px; text-align: center; }
.nav-links { display: inline-flex; gap: 8px; }
.page-numbers { padding: 6px 12px; text-decoration: none; }
.page-numbers.current { background: var(--mm-color-bg-alt); }

/* ---------- Pied de page ---------- */
.mm-footer__main { display: grid; gap: 40px; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); padding-block: 56px; }
.mm-footer__list { list-style: none; margin: 0; padding: 0; }
.mm-footer__bottom { text-align: center; }
.mm-social { list-style: none; margin: 16px 0 0; padding: 0; display: flex; gap: 12px; }
.mm-social a { display: inline-flex; width: 36px; height: 36px; align-items: center; justify-content: center; border-radius: 50%; text-decoration: none; }
.mm-social .mm-icon { width: 16px; height: 16px; }

/* ---------- Grain (texture photo) ----------
 * .mm-grain sur un conteneur positionné ajoute un léger bruit par-dessus.
 * Intensité réglable avec --mm-grain-opacity.
 */
.mm-grain { position: relative; isolation: isolate; }
.mm-grain::after {
	content: ""; position: absolute; inset: 0; pointer-events: none; z-index: 2;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
	opacity: var(--mm-grain-opacity, .14);
	mix-blend-mode: multiply;
}

/* ---------- Accessibilité mouvement ---------- */
@media (prefers-reduced-motion: reduce) {
	*, *::before, *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; scroll-behavior: auto !important; }
}
