/* =============================================
MemoMori — Article Template Global CSS
Appliqué sur tous les articles du blog
============================================= */
/* Import fonts */
@import url(‘https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400;0,500;0,600;1,400&family=DM+Sans:wght@300;400;500;600;700&display=swap’);
/* Fond crème sur toutes les pages articles */
body.single-post { background: #F5F1EB !important; }
body.single-post .site-content,
body.single-post #page,
body.single-post .ast-separate-container { background: #F5F1EB !important; }
/* Masquer éléments WordPress natifs inutiles */
body.single-post .entry-meta,
body.single-post .ast-post-meta-wrap,
body.single-post .posted-on,
body.single-post .ast-author-meta,
body.single-post .entry-footer { display: none !important; }
/* Typographie article */
body.single-post .entry-content {
font-family: ‘DM Sans’, -apple-system, sans-serif !important;
font-size: 16px !important;
color: #2A2A28 !important;
line-height: 1.75 !important;
max-width: 780px !important;
margin-left: auto !important;
margin-right: auto !important;
padding: 0 24px !important;
}
/* Titre H1 */
body.single-post .entry-title {
font-family: ‘Playfair Display’, Georgia, serif !important;
font-size: 34px !important;
font-weight: 500 !important;
color: #1E1E1C !important;
line-height: 1.2 !important;
letter-spacing: -0.02em !important;
max-width: 780px !important;
margin: 40px auto 12px !important;
padding: 0 24px !important;
}
/* H2 */
body.single-post .entry-content h2 {
font-family: ‘Playfair Display’, Georgia, serif !important;
font-size: 22px !important;
font-weight: 500 !important;
color: #1E1E1C !important;
margin: 40px 0 16px !important;
padding-bottom: 10px !important;
border-bottom: 1px solid rgba(184,148,95,0.3) !important;
}
/* H3 */
body.single-post .entry-content h3 {
font-family: ‘Playfair Display’, Georgia, serif !important;
font-size: 18px !important;
font-weight: 500 !important;
color: #2E3A4A !important;
margin: 28px 0 10px !important;
}
/* Paragraphes et listes */
body.single-post .entry-content p { margin-bottom: 18px !important; }
body.single-post .entry-content ul,
body.single-post .entry-content ol { margin: 0 0 18px 24px !important; }
body.single-post .entry-content li { margin-bottom: 8px !important; line-height: 1.7 !important; }
/* Liens */
body.single-post .entry-content a { color: #B8945F !important; }
body.single-post .entry-content a:hover { color: #96773E !important; }
/* Strong */
body.single-post .entry-content strong { color: #1E1E1C !important; font-weight: 600 !important; }
/* Composants MemoMori articles */
.mm-article-header {
max-width: 780px;
margin: 0 auto;
padding: 40px 24px 0;
}
.mm-breadcrumb {
font-size: 13px;
color: #9B9A95;
font-family: ‘DM Sans’, sans-serif;
margin-bottom: 16px;
}
.mm-breadcrumb a { color: #9B9A95; text-decoration: none; }
.mm-breadcrumb a:hover { color: #B8945F; }
.mm-meta {
display: flex;
align-items: center;
gap: 14px;
font-size: 13px;
color: #9B9A95;
margin-top: 10px;
margin-bottom: 32px;
flex-wrap: wrap;
}
.mm-meta-tag {
background: rgba(184,148,95,0.12);
color: #B8945F;
padding: 3px 10px;
border-radius: 20px;
font-size: 12px;
font-weight: 600;
}
.mm-cta-mid {
background: #2E3A4A;
border-radius: 12px;
padding: 22px 28px;
margin: 44px 0;
display: flex;
align-items: center;
justify-content: space-between;
gap: 20px;
flex-wrap: wrap;
}
.mm-cta-mid-text {
font-family: ‘DM Sans’, sans-serif;
line-height: 1.5;
}
.mm-cta-mid-text strong {
color: #F5F1EB !important;
font-weight: 700;
font-size: 15px;
display: block;
margin-bottom: 4px;
}
.mm-cta-mid-text span {
color: rgba(245,241,235,0.75);
font-size: 13px;
}
.mm-cta-mid-btn {
display: inline-flex;
align-items: center;
gap: 8px;
font-size: 14px;
font-weight: 600;
padding: 11px 22px;
background: #B8945F;
color: #FFF !important;
border-radius: 8px;
text-decoration: none !important;
white-space: nowrap;
flex-shrink: 0;
font-family: ‘DM Sans’, sans-serif;
transition: background 0.2s;
}
.mm-cta-mid-btn:hover { background: #A6834F; color: #FFF !important; text-decoration: none !important; }
.mm-section-title {
font-family: ‘Playfair Display’, Georgia, serif;
font-size: 20px;
font-weight: 500;
color: #1E1E1C;
margin: 40px 0 18px;
padding-bottom: 10px;
border-bottom: 1px solid rgba(184,148,95,0.3);
}
.mm-faq-item {
border: 1px solid rgba(46,58,74,0.1);
border-radius: 10px;
margin-bottom: 8px;
overflow: hidden;
background: #fff;
}
.mm-faq-q {
padding: 16px 20px;
cursor: pointer;
display: flex;
justify-content: space-between;
align-items: center;
gap: 12px;
font-size: 15px;
font-weight: 600;
color: #1E1E1C;
font-family: ‘Playfair Display’, Georgia, serif;
user-select: none;
transition: color 0.15s;
}
.mm-faq-q:hover { color: #B8945F; }
.mm-faq-chevron { color: #B8945F; font-size: 18px; transition: transform 0.25s; flex-shrink: 0; line-height: 1; }
.mm-faq-chevron.open { transform: rotate(180deg); }
.mm-faq-a { max-height: 0; overflow: hidden; transition: max-height 0.3s ease; }
.mm-faq-a.open { max-height: 500px; }
.mm-faq-a-inner { padding: 4px 20px 16px; font-size: 14px; color: #6B6A65; line-height: 1.7; font-family: ‘DM Sans’, sans-serif; }
.mm-related-grid {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
gap: 12px;
}
.mm-related-card {
display: block;
background: #fff;
border: 1px solid rgba(46,58,74,0.1);
border-radius: 10px;
padding: 16px 18px;
text-decoration: none !important;
transition: border-color 0.15s;
}
.mm-related-card:hover { border-color: #B8945F; }
.mm-related-card-title {
font-size: 14px;
font-weight: 600;
color: #1E1E1C !important;
font-family: ‘Playfair Display’, Georgia, serif;
line-height: 1.4;
margin-bottom: 6px;
}
.mm-related-card-cta { font-size: 12px; color: #B8945F !important; }
.mm-back { text-align: center; margin: 32px 0 48px; }
.mm-back a { color: #B8945F !important; text-decoration: none !important; font-size: 14px; font-weight: 600; }
/* =============================================
Fixes – avril 2026
============================================= */
/* Header sticky : compense les 104px sur les articles */
body.single-post .site-main {
padding-top: 110px;
}
/* .mm-cta : force les couleurs lisibles sur fond navy */
.mm-cta h3 { color: #ffffff !important; }
.mm-cta a { color: #ffffff !important; }