/* Livre d'or : un livre ancien ouvert (deux pages sur ordinateur, une colonne sur téléphone),
   papier vieilli dessiné en CSS, filigrane « Mehaigne Mouche », formulaire sur une page à remplir. */

.mm-livre-or {
	--papier: #f1e4c8;
	--encre: #3b2a17;
	--encre-pale: #7d6446;
	--sepia: #6b3f12;
	--titre: var(--wp--preset--font-family--titre, Georgia, serif);
	margin: 2.5rem 0 1rem;
}
p.mm-livre-intro { max-width: 44rem; margin-left: auto !important; margin-right: auto !important; text-align: center; font-size: 1.15rem; line-height: 1.7; color: var(--wp--preset--color--blanc); }
p.mm-livre-intro + p.mm-livre-intro { color: var(--wp--preset--color--gris); }

/* ------------------------------------------------ Le livre */
.mm-livre { max-width: 66rem; margin: 0 auto; scroll-margin-top: 1.5rem; }
.mm-livre-ouvert {
	position: relative;
	display: grid;
	grid-template-columns: 1fr 1fr;
	padding: 14px;
	border-radius: 14px;
	background: linear-gradient(135deg, #4d3018 0%, #2f1c0c 55%, #3e2612 100%);
	box-shadow: 0 30px 60px rgba(0, 0, 0, .55), inset 0 0 0 2px rgba(211, 177, 110, .22), inset 0 0 0 7px rgba(0, 0, 0, .18);
	perspective: 2400px;
}
/* Reliure au centre */
.mm-livre-ouvert::after {
	content: "";
	position: absolute;
	top: 14px;
	bottom: 14px;
	left: 50%;
	width: 2px;
	transform: translateX(-50%);
	background: rgba(70, 40, 15, .45);
	box-shadow: 0 0 22px 9px rgba(70, 40, 15, .22);
	pointer-events: none;
	z-index: 3;
}
.mm-livre-page {
	position: relative;
	min-height: 36rem;
	padding: 3.2rem 2.8rem 3.8rem;
	color: var(--encre);
	background-color: var(--papier);
	background-image:
		radial-gradient(ellipse at 50% 45%, rgba(255, 251, 238, .6) 0%, rgba(255, 251, 238, 0) 62%),
		radial-gradient(ellipse at 50% 50%, transparent 58%, rgba(125, 82, 32, .26) 100%),
		radial-gradient(ellipse 22% 16% at 10% 92%, rgba(140, 95, 40, .10), transparent),
		radial-gradient(ellipse 14% 10% at 84% 14%, rgba(140, 95, 40, .06), transparent),
		repeating-linear-gradient(0deg, rgba(120, 90, 40, .028) 0 1px, transparent 1px 3px);
	overflow: hidden;
	transform-style: preserve-3d;
	backface-visibility: hidden;
}
.mm-livre-page:first-child { border-radius: 9px 3px 3px 9px; box-shadow: inset -28px 0 32px -22px rgba(70, 40, 15, .45); }
.mm-livre-page:last-child { border-radius: 3px 9px 9px 3px; box-shadow: inset 28px 0 32px -22px rgba(70, 40, 15, .45); }
/* Filigrane très discret */
.mm-livre-page::before {
	content: "Mehaigne Mouche";
	position: absolute;
	inset: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	font-family: var(--titre);
	font-style: italic;
	font-size: clamp(2.2rem, 4.6vw, 4rem);
	color: rgba(110, 72, 28, .065);
	white-space: nowrap;
	transform: rotate(-24deg);
	pointer-events: none;
}
.mm-livre-contenu { position: relative; z-index: 1; }

/* Inscriptions */
.mm-livre-inscription { margin: 0; }
.mm-livre-texte p { margin: 0 0 .6rem; font-family: var(--titre); font-style: italic; font-size: 1.24rem; line-height: 1.55; color: var(--encre); text-align: left; overflow-wrap: anywhere; }
.mm-livre-inscription footer { display: flex; flex-wrap: wrap; justify-content: flex-end; align-items: baseline; gap: .2rem .8rem; margin-top: .4rem; }
.mm-livre-signature { font-family: var(--titre); font-weight: 600; font-size: 1.18rem; color: var(--sepia); }
.mm-livre-signature::before { content: "— "; }
.mm-livre-inscription time { font-size: .8rem; letter-spacing: .03em; color: var(--encre-pale); }
/* Ornement entre deux inscriptions : un filet fin avec un petit losange au centre */
.mm-livre-ornement { position: relative; height: 10px; margin: 1.4rem auto 1.2rem; width: 55%; }
.mm-livre-ornement::before { content: ""; position: absolute; left: 0; right: 0; top: 50%; border-top: 1px solid rgba(154, 106, 44, .45); }
.mm-livre-ornement span { position: absolute; left: 50%; top: 50%; width: 8px; height: 8px; background: var(--papier); border: 1px solid #9a6a2c; transform: translate(-50%, -50%) rotate(45deg); }
.mm-livre-vide { margin: 7rem 0 1rem; text-align: center; font-family: var(--titre); font-style: italic; font-size: 1.5rem; line-height: 1.5; color: var(--encre-pale); }
.mm-livre-vide-suite { margin-top: 12rem; font-size: 1.25rem; opacity: .75; }
.mm-livre-vide-lien { text-align: center; }
.mm-livre-vide-lien a { color: var(--sepia); font-weight: 600; text-underline-offset: 3px; }
.mm-livre-folio { position: absolute; left: 50%; bottom: 1.3rem; transform: translateX(-50%); font-family: var(--titre); font-style: italic; font-size: 1rem; color: var(--encre-pale); z-index: 1; }

/* Navigation entre les pages */
.mm-livre-nav { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: .8rem 1.2rem; margin: 1.6rem 0 0; }
.mm-livre-bouton { display: inline-flex; align-items: center; padding: .8rem 1.6rem; border: 1px solid var(--wp--preset--color--dore); border-radius: 999px; background: var(--wp--preset--color--olive); color: var(--wp--preset--color--blanc); font-weight: 600; text-decoration: none; line-height: 1; transition: background .2s, color .2s, transform .2s; }
a.mm-livre-bouton:hover { background: var(--wp--preset--color--dore); color: var(--wp--preset--color--encre); transform: translateY(-2px); }
.mm-livre-bouton.mm-inactif { opacity: .3; }
.mm-livre-position { font-size: .9rem; color: var(--wp--preset--color--gris); }

/* Tourner la page (ordinateur) */
.mm-livre-ouvert.mm-tourne-suivant .mm-livre-page:last-child { transform-origin: left center; animation: mm-tourne-suivant .6s ease-in forwards; z-index: 4; }
.mm-livre-ouvert.mm-tourne-precedent .mm-livre-page:first-child { transform-origin: right center; animation: mm-tourne-precedent .6s ease-in forwards; z-index: 4; }
@keyframes mm-tourne-suivant { to { transform: rotateY(-178deg); box-shadow: -30px 0 40px rgba(0, 0, 0, .35); } }
@keyframes mm-tourne-precedent { to { transform: rotateY(178deg); box-shadow: 30px 0 40px rgba(0, 0, 0, .35); } }
.mm-livre-ouvert.mm-arrive .mm-livre-contenu { animation: mm-livre-apparait .45s ease-out; }
@keyframes mm-livre-apparait { from { opacity: 0; } to { opacity: 1; } }

/* ------------------------------------------------ Formulaire : une page à remplir */
.mm-livre-ecrire {
	max-width: 46rem;
	margin: 3.5rem auto 0;
	padding: 2.4rem 2.6rem 2rem;
	border-radius: 10px;
	color: var(--encre);
	background-color: var(--papier);
	background-image: radial-gradient(ellipse at 50% 50%, transparent 60%, rgba(125, 82, 32, .22) 100%), repeating-linear-gradient(0deg, rgba(120, 90, 40, .028) 0 1px, transparent 1px 3px);
	box-shadow: 0 20px 45px rgba(0, 0, 0, .45);
	scroll-margin-top: 1.5rem;
}
.mm-livre-ecrire h2 { margin: 0 0 1.2rem; text-align: center; font-family: var(--titre); font-size: clamp(1.7rem, 1.4rem + 1vw, 2.2rem); color: var(--sepia); }
.mm-livre-formulaire label { display: block; margin: 0 0 1.2rem; font-weight: 600; font-size: .95rem; color: var(--encre); }
.mm-livre-formulaire small { font-weight: 400; color: var(--encre-pale); }
.mm-livre-oblig { color: #ac2e17; }
.mm-livre-formulaire input[type=text], .mm-livre-formulaire input[type=email], .mm-livre-formulaire textarea {
	display: block;
	width: 100%;
	box-sizing: border-box;
	margin-top: .35rem;
	padding: .6rem .2rem;
	border: 0;
	border-bottom: 1.5px solid rgba(107, 63, 18, .45);
	border-radius: 0;
	background: transparent;
	color: var(--encre);
	font: inherit;
	font-weight: 400;
}
.mm-livre-formulaire textarea { padding: .6rem .7rem; border: 1.5px solid rgba(107, 63, 18, .35); border-radius: 6px; background: rgba(255, 251, 238, .45); font-family: var(--titre); font-style: italic; font-size: 1.2rem; line-height: 1.5; resize: vertical; }
.mm-livre-formulaire input:focus, .mm-livre-formulaire textarea:focus { outline: 2px solid #b0711a; outline-offset: 2px; }
.mm-livre-champs { display: grid; grid-template-columns: 1fr 1fr; gap: 0 1.6rem; }
.mm-livre-formulaire label.mm-livre-case { display: flex; gap: .6rem; align-items: flex-start; font-weight: 400; font-size: .9rem; line-height: 1.5; }
.mm-livre-case input { flex: 0 0 auto; margin-top: .25rem; width: 1.1rem; height: 1.1rem; accent-color: #645117; }
.mm-livre-case a { color: var(--sepia); }
.mm-livre-envoyer { margin-top: .4rem; }
.mm-livre-piege { position: absolute !important; left: -9999px !important; width: 1px; height: 1px; overflow: hidden; }
.mm-livre-avis { margin: 0 0 1.2rem; padding: .9rem 1.1rem; border-radius: 8px; font-size: .98rem; line-height: 1.5; }
.mm-livre-avis-ok { background: #e3ecd2; border-left: 4px solid #4f7a2a; color: #2b4214; }
.mm-livre-avis-erreur { background: #f6dcd3; border-left: 4px solid #ac2e17; color: #5e1a0d; }
.mm-livre-ecrire > p a { color: var(--sepia); font-weight: 600; }

/* ------------------------------------------------ Téléphone : une page à la fois, l'une sous l'autre */
@media (max-width: 760px) {
	.mm-livre-ouvert { grid-template-columns: 1fr; gap: 8px; padding: 8px; border-radius: 12px; }
	.mm-livre-ouvert::after { display: none; }
	.mm-livre-page { min-height: 0; padding: 2.4rem 1.4rem 3.4rem; }
	.mm-livre-page:first-child, .mm-livre-page:last-child { border-radius: 8px; box-shadow: none; }
	.mm-livre-page::before { font-size: 2.3rem; }
	.mm-livre-texte p { font-size: 1.15rem; }
	.mm-livre-vide { margin: 2.5rem 0 1rem; font-size: 1.3rem; }
	.mm-livre-vide-suite { margin: 1.5rem 0; }
	.mm-livre-position { order: -1; width: 100%; text-align: center; }
	.mm-livre-nav { gap: .6rem; }
	.mm-livre-bouton { flex: 1 1 0; justify-content: center; padding: .75rem .6rem; font-size: .92rem; white-space: nowrap; }
	.mm-livre-ecrire { padding: 1.8rem 1.3rem 1.4rem; }
	.mm-livre-champs { grid-template-columns: 1fr; }
	.mm-livre-ouvert.mm-tourne-suivant .mm-livre-page, .mm-livre-ouvert.mm-tourne-precedent .mm-livre-page { animation: mm-livre-efface .3s ease-in forwards; }
	@keyframes mm-livre-efface { to { opacity: 0; transform: translateY(8px); } }
}
@media (prefers-reduced-motion: reduce) {
	.mm-livre-ouvert *, .mm-livre-bouton { animation: none !important; transition: none !important; }
}