/*
Theme Name: Camille Masson — GeneratePress Child (Direction 2)
Theme URI: https://camillemasson-avocat.fr
Description: Theme enfant GeneratePress pour le site Maitre Camille Masson — Direction 2 "Moderne & Institutionnel" validee 04/05/2026 (Bleu nuit avocat / Or vieilli / Vert tilleul, Cormorant Garamond + Inter).
Author: Twaino
Author URI: https://www.twaino.com
Template: generatepress
Version: 1.0.0
Text Domain: generatepress-masson
*/
/* ============ DIRECTION 2 — VARIABLES ============ */
:root {
--d2-navy: #0B3B5A;
--d2-gold: #B8893E;
--d2-sage: #7A8C6B;
--d2-anthracite: #1A1A1A;
--d2-cream: #F8F7F5;
--d2-cream-soft: #FBFAF8;
--d2-divider: rgba(11,59,90,.12);
/* GeneratePress overrides */
--base-color: var(--d2-anthracite);
--text-color: var(--d2-anthracite);
--background-color: var(--d2-cream);
--accent: var(--d2-navy);
--accent-hover: var(--d2-gold);
--accent-2: var(--d2-gold);
--contrast: var(--d2-navy);
--contrast-2: var(--d2-anthracite);
--contrast-3: var(--d2-sage);
}
/* ============ BASE ============ */
html, body {
background: var(--d2-cream);
color: var(--d2-anthracite);
}
body {
font-family: 'Inter', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
font-size: 16px;
line-height: 1.55;
font-weight: 400;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
/* ============ HEADINGS ============ */
h1, h2, h3, h4, h5, h6,
.entry-title, .site-title,
.wp-block-heading {
font-family: 'Cormorant Garamond', Georgia, "Times New Roman", serif;
color: var(--d2-navy);
font-weight: 600;
line-height: 1.15;
letter-spacing: -0.5px;
margin-top: 0;
}
h1, .entry-title { font-size: 52px; }
h2 { font-size: 38px; }
h3 { font-size: 26px; }
h4 { font-size: 18px; font-weight: 700; }
h5 { font-size: 16px; font-weight: 700; text-transform: uppercase; letter-spacing: 1px; }
h6 { font-size: 14px; font-weight: 700; text-transform: uppercase; letter-spacing: 1.5px; }
@media (max-width: 768px) {
h1, .entry-title { font-size: 36px; }
h2 { font-size: 28px; }
h3 { font-size: 22px; }
}
/* ============ LINKS ============ */
a {
color: var(--d2-navy);
text-decoration: none;
transition: color 220ms cubic-bezier(.4,0,.2,1);
}
a:hover, a:focus {
color: var(--d2-gold);
}
.entry-content a {
text-decoration: underline;
text-decoration-color: var(--d2-gold);
text-decoration-thickness: 1px;
text-underline-offset: 3px;
}
/* ============ BUTTONS ============ */
.wp-block-button__link,
.button,
button,
input[type="submit"],
input[type="button"],
.entry-content .wp-block-button__link {
background: var(--d2-navy);
color: var(--d2-cream) !important;
border: none;
border-radius: 2px;
padding: 14px 28px;
font-family: 'Inter', sans-serif;
font-weight: 500;
font-size: 15px;
letter-spacing: 0.3px;
cursor: pointer;
text-transform: none;
transition: background 220ms cubic-bezier(.4,0,.2,1), transform 220ms;
text-decoration: none;
display: inline-block;
}
.wp-block-button__link:hover,
.button:hover,
button:hover,
input[type="submit"]:hover,
input[type="button"]:hover {
background: var(--d2-sage);
color: white !important;
transform: translateY(-1px);
}
.wp-block-button.is-style-outline .wp-block-button__link,
.button.btn-secondary {
background: transparent;
color: var(--d2-navy) !important;
border: 1px solid var(--d2-navy);
}
.wp-block-button.is-style-outline .wp-block-button__link:hover {
background: var(--d2-navy);
color: var(--d2-cream) !important;
}
/* CTA "or vieilli" - alternative */
.button-secondary,
.wp-block-button.btn-gold .wp-block-button__link {
background: var(--d2-gold);
}
.button-secondary:hover,
.wp-block-button.btn-gold .wp-block-button__link:hover {
background: #9F7733;
}
/* ============ HEADER ============ */
.site-header {
background: var(--d2-cream);
border-bottom: 1px solid var(--d2-divider);
padding: 12px 0;
}
.inside-header {
align-items: center;
}
.site-title,
.site-title a {
font-family: 'Cormorant Garamond', serif;
color: var(--d2-navy);
font-weight: 600;
font-size: 28px;
letter-spacing: -0.5px;
}
.site-description {
font-family: 'Inter', sans-serif;
color: var(--d2-sage);
font-size: 13px;
font-style: italic;
letter-spacing: 0.3px;
margin-top: 2px;
}
/* ============ MAIN NAVIGATION ============ */
.main-navigation {
background: var(--d2-cream);
border-top: 1px solid var(--d2-divider);
}
.main-navigation .main-nav ul li a {
color: var(--d2-navy);
font-family: 'Inter', sans-serif;
font-weight: 500;
font-size: 15px;
letter-spacing: 0.3px;
padding: 18px 20px;
text-transform: none;
}
.main-navigation .main-nav ul li a:hover,
.main-navigation .main-nav ul li.current-menu-item > a,
.main-navigation .main-nav ul li.current-menu-ancestor > a {
color: var(--d2-gold);
}
.main-navigation .main-nav ul ul {
background: var(--d2-cream);
border: 1px solid var(--d2-divider);
border-top: 2px solid var(--d2-navy);
box-shadow: 0 4px 16px rgba(11,59,90,.08);
}
.main-navigation .main-nav ul ul li a {
color: var(--d2-anthracite);
font-size: 14px;
padding: 12px 20px;
}
.main-navigation .main-nav ul ul li a:hover {
background: rgba(184,137,62,.08);
color: var(--d2-navy);
}
/* CTA in nav */
.main-navigation .main-nav ul li.menu-cta a,
.main-navigation .main-nav ul li.menu-item-cta a {
background: var(--d2-gold);
color: var(--d2-cream);
margin-left: 20px;
padding: 10px 22px !important;
border-radius: 2px;
font-weight: 600;
}
.main-navigation .main-nav ul li.menu-cta a:hover,
.main-navigation .main-nav ul li.menu-item-cta a:hover {
background: #9F7733;
color: white;
}
/* ============ HERO / ENTRY HEADER ============ */
.entry-header,
.hero-section,
.page-hero {
padding: 80px 0;
background: var(--d2-cream);
}
.entry-header .entry-title {
font-size: 52px;
margin-bottom: 16px;
}
.eyebrow,
.pre-title,
.entry-meta-eyebrow {
display: inline-block;
font-family: 'Inter', sans-serif;
font-size: 12px;
font-weight: 500;
text-transform: uppercase;
letter-spacing: 1.5px;
color: var(--d2-gold);
margin-bottom: 12px;
}
/* ============ FOOTER ============ */
.site-footer,
.footer-widgets {
background: var(--d2-navy);
color: var(--d2-cream);
}
.site-footer h1, .site-footer h2, .site-footer h3, .site-footer h4 {
color: var(--d2-cream);
}
.site-footer .widget-title,
.footer-widgets .widget-title {
font-family: 'Cormorant Garamond', serif;
color: var(--d2-cream);
font-size: 20px;
font-weight: 600;
margin-bottom: 16px;
padding-bottom: 8px;
border-bottom: 1px solid var(--d2-gold);
}
.site-footer a,
.footer-widgets a {
color: var(--d2-cream);
text-decoration: none;
}
.site-footer a:hover,
.footer-widgets a:hover {
color: var(--d2-gold);
}
.site-footer ul {
list-style: none;
padding: 0;
margin: 0;
}
.site-footer ul li {
padding: 6px 0;
font-family: 'Inter', sans-serif;
font-size: 14px;
}
.footer-widgets {
padding: 60px 0 40px;
}
.site-info {
background: var(--d2-anthracite);
color: rgba(248,247,245,.55);
padding: 18px 0;
font-size: 13px;
font-family: 'Inter', sans-serif;
border-top: 1px solid rgba(184,137,62,.15);
}
.site-info a { color: rgba(248,247,245,.75); }
/* ============ CONTENT ============ */
.entry-content,
.page-content {
font-family: 'Inter', sans-serif;
font-size: 16px;
line-height: 1.7;
color: var(--d2-anthracite);
}
.entry-content p { margin-bottom: 1.4em; }
.entry-content blockquote {
border-left: 3px solid var(--d2-gold);
padding: 8px 0 8px 24px;
font-family: 'Cormorant Garamond', serif;
font-size: 22px;
font-style: italic;
color: var(--d2-navy);
margin: 32px 0;
}
/* Lists */
.entry-content ul li::marker,
.entry-content ol li::marker {
color: var(--d2-gold);
}
/* ============ FORMS ============ */
input[type="text"], input[type="email"], input[type="tel"],
input[type="url"], input[type="password"],
textarea, select {
border: 1px solid rgba(11,59,90,.2);
border-radius: 4px;
padding: 12px 14px;
font-family: 'Inter', sans-serif;
font-size: 15px;
color: var(--d2-anthracite);
background: white;
width: 100%;
transition: border-color 220ms, box-shadow 220ms;
}
input:focus, textarea:focus, select:focus {
border-color: var(--d2-navy);
outline: none;
box-shadow: 0 0 0 3px rgba(11,59,90,.12);
}
/* ============ GENERATEBLOCKS / CARDS ============ */
.gb-container,
.wp-block-group {
border-radius: 2px;
}
.gb-container.card-expertise {
background: white;
border: 1px solid var(--d2-divider);
padding: 32px;
transition: border-color 220ms cubic-bezier(.4,0,.2,1), box-shadow 220ms;
}
.gb-container.card-expertise:hover {
border-color: var(--d2-gold);
box-shadow: 0 4px 16px rgba(11,59,90,.06);
}
/* Tags / Pills */
.tag, .badge,
.entry-tags a,
.tagcloud a {
display: inline-block;
background: rgba(122,140,107,.15);
color: var(--d2-sage);
padding: 4px 12px;
border-radius: 999px;
font-family: 'Inter', sans-serif;
font-size: 12px;
font-weight: 600;
text-transform: uppercase;
letter-spacing: 1px;
text-decoration: none;
}
/* ============ BREADCRUMBS ============ */
.breadcrumbs,
.yoast-breadcrumbs {
font-family: 'Inter', sans-serif;
font-size: 13px;
color: var(--d2-sage);
padding: 16px 0;
}
.breadcrumbs a,
.yoast-breadcrumbs a {
color: var(--d2-navy);
}
.breadcrumbs a:hover,
.yoast-breadcrumbs a:hover {
color: var(--d2-gold);
}
/* ============ POST META ============ */
.entry-meta {
font-family: 'Inter', sans-serif;
font-size: 13px;
color: var(--d2-sage);
}
/* ============ SIDEBAR / WIDGETS ============ */
.widget {
margin-bottom: 40px;
}
.widget .widget-title {
font-family: 'Cormorant Garamond', serif;
color: var(--d2-navy);
font-size: 22px;
font-weight: 600;
margin-bottom: 16px;
padding-bottom: 8px;
border-bottom: 1px solid var(--d2-divider);
}
/* ============ BACK TO TOP ============ */
.generate-back-to-top {
background: var(--d2-navy);
color: var(--d2-cream);
border-radius: 2px;
}
.generate-back-to-top:hover {
background: var(--d2-gold);
}
/* ============ RESPONSIVE TWEAKS ============ */
@media (max-width: 768px) {
.entry-header { padding: 48px 0; }
.footer-widgets { padding: 40px 0 24px; }
.main-navigation .main-nav ul li a { padding: 14px 16px; }
}
/* ============ ACCESSIBILITY ============ */
:focus-visible {
outline: 2px solid var(--d2-gold);
outline-offset: 2px;
}
.skip-link:focus {
background: var(--d2-navy);
color: var(--d2-cream);
}
/* ============ ANIMATIONS ============ */
* {
transition-timing-function: cubic-bezier(.4,0,.2,1);
}
/* ============ FRONT PAGE — hide auto entry-title (we have our own H1 in content) ============ */
.home.page .entry-header,
.page-id-2463 .entry-header {
display: none !important;
}
/* ============ HEADER LAYOUT ============ */
.inside-header {
display: flex;
align-items: center;
justify-content: space-between;
flex-wrap: nowrap;
}
.site-branding {
flex-shrink: 0;
max-width: 320px;
}
.site-title {
font-family: 'Cormorant Garamond', serif;
font-size: 24px;
line-height: 1.1;
margin: 0;
}
.site-description {
font-size: 12px;
margin-top: 4px;
}
/* ============ MAIN NAV — make items fit on one line ============ */
.main-navigation .main-nav ul li a {
padding: 18px 14px;
font-size: 14px;
}
.main-navigation .main-nav ul li.menu-item-cta a,
.main-navigation .main-nav ul li.menu-cta a {
background: var(--d2-gold);
color: var(--d2-cream) !important;
padding: 10px 18px !important;
margin-left: 12px;
border-radius: 2px;
font-weight: 600;
font-size: 14px;
}
.main-navigation .main-nav ul li.menu-item-cta a::before,
.main-navigation .main-nav ul li.menu-cta a::before {
content: "📞 ";
margin-right: 4px;
}
.main-navigation .main-nav ul li.menu-item-cta a:hover,
.main-navigation .main-nav ul li.menu-cta a:hover {
background: #9F7733;
color: white !important;
}
/* Eyebrow on hero (front page) */
.home .entry-content > p:first-of-type {
/* keep as is */
}
/* Entry meta (post date) on blog list */
.blog .entry-meta,
.archive .entry-meta {
font-size: 12px;
text-transform: uppercase;
letter-spacing: 1px;
color: var(--d2-sage);
}
/* ============ FRONT PAGE — top spacing ============ */
.home .site-content,
.page-id-2463 .site-content {
padding-top: 40px;
}
.home .entry-content > h1:first-child,
.page-id-2463 .entry-content > h1:first-child {
margin-top: 0;
font-size: 44px;
line-height: 1.2;
max-width: 900px;
}
/* Footer headlines visibility */
.gb-headline {
color: var(--d2-navy);
}
.site-footer .gb-headline,
.footer-widgets .gb-headline {
color: var(--d2-cream);
}
/* Menu CTA icon -> proper SVG */
.main-navigation .main-nav ul li.menu-cta a::before {
content: "";
display: inline-block;
width: 14px;
height: 14px;
margin-right: 6px;
vertical-align: -2px;
background: currentColor;
-webkit-mask: url("data:image/svg+xml;utf8,") no-repeat center;
mask: url("data:image/svg+xml;utf8,") no-repeat center;
}
/* TOC plugin — match D2 */
#ez-toc-container {
background: white;
border: 1px solid var(--d2-divider);
border-left: 3px solid var(--d2-gold);
border-radius: 2px;
}
#ez-toc-container .ez-toc-title {
font-family: 'Cormorant Garamond', serif;
color: var(--d2-navy);
}
#ez-toc-container a {
color: var(--d2-anthracite);
}
#ez-toc-container a:hover {
color: var(--d2-gold);
}
/* ============ FIX: smaller site title + tagline ============ */
.site-title {
font-size: 22px !important;
line-height: 1.1 !important;
letter-spacing: -0.3px !important;
}
.site-title a {
font-size: 22px !important;
}
.site-description {
font-size: 11px !important;
margin-top: 2px !important;
}
.site-branding {
max-width: 280px !important;
}
.inside-header {
padding: 12px 30px;
}
/* ============ FALLBACK: hide any GenerateBlocks footer hook stray ============ */
.site-content + [class*="generate_footer"],
body > .gb-container[class*="abstract-shapes"],
body > .generate-after-footer-area {
display: none !important;
}
/* ============ FIX: hide GP default copyright-bar (we have our own footer-bar) ============ */
.copyright-bar {
display: none !important;
}
/* ============================================================
ARBORESCENCE STYLE — Menu & Footer (D2 — bleu nuit + or vieilli)
============================================================ */
/* ---------- MENU PRINCIPAL ---------- */
/* Top-level items: bleu nuit + underline or vieilli en hover/active */
.main-navigation .main-nav > ul > li > a {
color: var(--d2-navy);
font-family: 'Cormorant Garamond', serif;
font-weight: 600;
font-size: 16px;
letter-spacing: 0.2px;
position: relative;
padding: 22px 16px 22px;
}
.main-navigation .main-nav > ul > li > a::after {
content: "";
position: absolute;
left: 16px;
right: 16px;
bottom: 14px;
height: 2px;
background: var(--d2-gold);
transform: scaleX(0);
transform-origin: left;
transition: transform 220ms cubic-bezier(.4,0,.2,1);
}
.main-navigation .main-nav > ul > li > a:hover::after,
.main-navigation .main-nav > ul > li.current-menu-item > a::after,
.main-navigation .main-nav > ul > li.current-menu-ancestor > a::after,
.main-navigation .main-nav > ul > li.menu-item-has-children:hover > a::after {
transform: scaleX(1);
}
/* Sub-menu: chevron › + tirets pointillés or vieilli */
.main-navigation .main-nav ul ul {
background: white;
border: none;
border-top: 2px solid var(--d2-gold);
box-shadow: 0 8px 24px rgba(11,59,90,.12);
padding: 8px 0;
min-width: 240px;
}
.main-navigation .main-nav ul ul li {
border-bottom: 1px dashed rgba(184,137,62,.4);
}
.main-navigation .main-nav ul ul li:last-child {
border-bottom: none;
}
.main-navigation .main-nav ul ul li a {
color: var(--d2-anthracite);
font-family: 'Inter', sans-serif;
font-size: 14px;
font-weight: 400;
padding: 12px 18px 12px 30px;
position: relative;
}
.main-navigation .main-nav ul ul li a::before {
content: "›";
position: absolute;
left: 14px;
color: var(--d2-gold);
font-weight: 700;
font-size: 16px;
top: 50%;
transform: translateY(-50%);
}
.main-navigation .main-nav ul ul li a:hover {
background: rgba(184,137,62,.06);
color: var(--d2-navy);
}
/* CTA — bleu nuit avec double label */
.main-navigation .main-nav ul li.menu-cta {
margin-left: 12px;
}
.main-navigation .main-nav ul li.menu-cta a,
.main-navigation .main-nav ul li.menu-item-cta a {
background: var(--d2-navy) !important;
color: var(--d2-cream) !important;
padding: 10px 22px !important;
border-radius: 2px !important;
text-align: center;
line-height: 1.15;
font-family: 'Inter', sans-serif;
font-weight: 600;
font-size: 15px;
display: inline-flex !important;
flex-direction: column;
align-items: center;
justify-content: center;
min-height: 50px;
}
.main-navigation .main-nav ul li.menu-cta a::before,
.main-navigation .main-nav ul li.menu-item-cta a::before {
content: "APPELER LE CABINET";
display: block;
font-size: 10px;
font-weight: 600;
letter-spacing: 2px;
color: var(--d2-gold);
margin-bottom: 2px;
background: none !important;
-webkit-mask: none !important;
mask: none !important;
width: auto !important;
height: auto !important;
vertical-align: baseline !important;
}
.main-navigation .main-nav ul li.menu-cta a:hover,
.main-navigation .main-nav ul li.menu-item-cta a:hover {
background: #082B43 !important;
color: white !important;
transform: translateY(-1px);
}
/* ---------- FOOTER ---------- */
/* Section titles — UPPERCASE or vieilli */
.site-footer .widget-title,
.footer-widgets .widget-title {
color: var(--d2-gold) !important;
font-family: 'Inter', sans-serif !important;
font-size: 13px !important;
font-weight: 600 !important;
text-transform: uppercase;
letter-spacing: 2.5px;
border-bottom: 1px dashed rgba(184,137,62,.4);
padding-bottom: 12px;
margin-bottom: 18px;
}
/* List items with › prefix + dashed separator */
.site-footer .widget ul,
.footer-widgets .widget ul {
list-style: none;
padding: 0;
margin: 0;
}
.site-footer .widget ul li,
.footer-widgets .widget ul li {
padding: 10px 0 10px 18px;
position: relative;
border-bottom: 1px dashed rgba(184,137,62,.18);
font-family: 'Inter', sans-serif;
font-size: 14px;
line-height: 1.5;
}
.site-footer .widget ul li:last-child,
.footer-widgets .widget ul li:last-child {
border-bottom: none;
}
.site-footer .widget ul li::before,
.footer-widgets .widget ul li::before {
content: "›";
position: absolute;
left: 0;
top: 10px;
color: var(--d2-gold);
font-weight: 700;
font-size: 14px;
}
/* Cabinet column (paragraph items) */
.site-footer .widget p,
.footer-widgets .widget p {
font-family: 'Inter', sans-serif;
font-size: 14px;
line-height: 1.6;
margin: 0 0 10px 0;
padding: 0;
}
.site-footer .widget p strong,
.footer-widgets .widget p strong {
font-family: 'Cormorant Garamond', serif;
font-size: 17px;
font-weight: 600;
color: var(--d2-cream);
letter-spacing: 0.2px;
}
/* Cabinet phone/email links emphasized */
.site-footer .widget a,
.footer-widgets .widget a {
color: var(--d2-cream);
text-decoration: none;
transition: color 220ms;
}
.site-footer .widget a:hover,
.footer-widgets .widget a:hover {
color: var(--d2-gold);
}
/* ---------- FOOTER BAR (copyright strip) ---------- */
.site-info {
background: var(--d2-anthracite);
padding: 20px 0;
border-top: 1px solid rgba(184,137,62,.15);
}
.footer-bar-content {
text-align: center;
font-family: 'Inter', sans-serif;
font-size: 13px;
color: rgba(248,247,245,.65);
letter-spacing: 0.3px;
}
.footer-bar-content a {
color: rgba(248,247,245,.85);
text-decoration: none;
}
.footer-bar-content a:hover {
color: var(--d2-gold);
}
.footer-bar-content .sep {
color: var(--d2-gold);
margin: 0 10px;
font-weight: 300;
}
.footer-bar-content .twaino-link {
color: var(--d2-gold);
font-weight: 600;
}
.footer-bar-content .twaino-link:hover {
color: var(--d2-cream);
}
/* Footer widgets area background fine-tuning */
.footer-widgets {
background: var(--d2-navy);
padding: 60px 0 40px;
}
/* ============================================================
ARBORESCENCE STYLE — REFINE (inspiré de Arbo HTML)
============================================================ */
:root {
--d2-accent-soft: #D4A960; /* or clair pour titres footer */
--d2-cream-text: #E8E4DC; /* texte items footer */
}
/* ---------- MENU PRINCIPAL — underline or vieilli permanent sur top-level ---------- */
.main-navigation .main-nav > ul > li > a {
font-family: 'Cormorant Garamond', serif;
font-size: 17px;
font-weight: 600;
color: var(--d2-navy);
letter-spacing: 0.2px;
padding: 22px 18px 22px;
position: relative;
}
/* PERMANENT underline sous chaque top-level item parent (.menu-item-has-children) */
.main-navigation .main-nav > ul > li.menu-item-has-children > a::after,
.main-navigation .main-nav > ul > li > a::after {
content: "";
position: absolute;
left: 18px;
right: 18px;
bottom: 14px;
height: 2px;
background: var(--d2-gold);
transform: scaleX(0);
transform-origin: left;
transition: transform 220ms cubic-bezier(.4,0,.2,1);
}
.main-navigation .main-nav > ul > li.menu-item-has-children > a::after {
transform: scaleX(1);
}
.main-navigation .main-nav > ul > li > a:hover::after,
.main-navigation .main-nav > ul > li.current-menu-item > a::after,
.main-navigation .main-nav > ul > li.current-menu-ancestor > a::after {
transform: scaleX(1);
}
/* Dropdown chevron */
.main-navigation .menu-item-has-children .dropdown-menu-toggle {
color: var(--d2-gold);
font-size: 10px;
margin-left: 4px;
}
/* ---------- FOOTER ---------- */
/* Section titles — Cormorant Garamond + or clair (#D4A960) + uppercase */
.site-footer .widget-title,
.footer-widgets .widget-title {
font-family: 'Cormorant Garamond', serif !important;
font-size: 15px !important;
font-weight: 500 !important;
color: var(--d2-accent-soft) !important;
text-transform: uppercase;
letter-spacing: 2px;
border-bottom: 1px solid rgba(255,255,255,.20);
padding-bottom: 10px;
margin-bottom: 14px;
}
/* List items — dotted separator + soft cream text */
.site-footer .widget ul li,
.footer-widgets .widget ul li {
color: var(--d2-cream-text);
border-bottom: 1px dotted rgba(255,255,255,.12);
padding: 8px 0 8px 14px;
font-family: 'Inter', sans-serif;
font-size: 14px;
line-height: 1.5;
position: relative;
}
.site-footer .widget ul li:last-child,
.footer-widgets .widget ul li:last-child {
border-bottom: none;
}
.site-footer .widget ul li::before,
.footer-widgets .widget ul li::before {
content: "›";
position: absolute;
left: 0;
top: 8px;
color: var(--d2-accent-soft);
font-weight: 600;
font-size: 14px;
}
.site-footer .widget ul li a,
.footer-widgets .widget ul li a {
color: var(--d2-cream-text);
}
.site-footer .widget ul li a:hover,
.footer-widgets .widget ul li a:hover {
color: var(--d2-accent-soft);
}
/* Cabinet column (paragraph) */
.site-footer .widget p,
.footer-widgets .widget p {
color: var(--d2-cream-text);
font-family: 'Inter', sans-serif;
font-size: 14px;
line-height: 1.6;
margin: 0 0 10px 0;
}
.site-footer .widget p strong,
.footer-widgets .widget p strong {
font-family: 'Cormorant Garamond', serif;
font-size: 18px;
font-weight: 600;
color: var(--d2-cream);
letter-spacing: 0.3px;
display: block;
margin-bottom: 6px;
}
.site-footer .widget p a,
.footer-widgets .widget p a {
color: var(--d2-accent-soft);
text-decoration: none;
}
.site-footer .widget p a:hover,
.footer-widgets .widget p a:hover {
color: var(--d2-cream);
text-decoration: underline;
text-decoration-color: var(--d2-accent-soft);
text-underline-offset: 3px;
}
/* Footer columns layout — 1.2fr 1fr 1fr 1fr */
@media (min-width: 769px) {
.footer-widgets .inside-footer-widgets {
display: grid !important;
grid-template-columns: 1.2fr 1fr 1fr 1fr;
gap: 36px;
align-items: start;
}
}
/* ---------- FOOTER BAR refine ---------- */
.footer-bar-content {
text-align: center;
font-family: 'Inter', sans-serif;
font-size: 13px;
color: rgba(248,247,245,.65);
}
.footer-bar-content .sep {
color: var(--d2-accent-soft);
margin: 0 14px;
opacity: 0.6;
}
.footer-bar-content .twaino-link {
color: var(--d2-accent-soft);
font-weight: 600;
}
/* ============ MENU FIX (override) ============ */
/* Remove permanent underline on top-level parent items — only show on hover/current */
.main-navigation .main-nav > ul > li.menu-item-has-children > a::after {
transform: scaleX(0) !important;
}
.main-navigation .main-nav > ul > li > a:hover::after,
.main-navigation .main-nav > ul > li.current-menu-item > a::after,
.main-navigation .main-nav > ul > li.current-menu-ancestor > a::after,
.main-navigation .main-nav > ul > li.menu-item-has-children > a:hover::after {
transform: scaleX(1) !important;
}
/* No underline at all on the CTA item */
.main-navigation .main-nav > ul > li.menu-cta > a::after,
.main-navigation .main-nav > ul > li.menu-item-cta > a::after {
display: none !important;
content: none !important;
}
/* ============================================================
MOBILE MENU FIX — show hamburger toggle on mobile, style slide-out
============================================================ */
@media (max-width: 768px) {
/* Show mobile toggle wrapper, hide desktop nav */
.main-navigation.mobile-menu-control-wrapper {
display: block !important;
background: var(--d2-cream);
border-top: 1px solid var(--d2-divider);
}
.main-navigation:not(.mobile-menu-control-wrapper):not(.slideout-navigation) {
display: none !important;
}
/* Hamburger button */
.menu-toggle {
display: flex !important;
align-items: center;
justify-content: flex-end;
background: transparent !important;
color: var(--d2-navy) !important;
border: none;
padding: 14px 20px !important;
cursor: pointer;
font-family: 'Inter', sans-serif;
font-size: 14px;
font-weight: 500;
text-transform: uppercase;
letter-spacing: 1px;
width: 100%;
}
.menu-toggle:hover,
.menu-toggle:focus {
background: rgba(11,59,90,.04) !important;
color: var(--d2-gold) !important;
}
.menu-toggle .mobile-menu {
color: inherit;
margin-right: 8px;
}
.menu-toggle .gp-icon svg,
.menu-toggle svg {
width: 22px;
height: 22px;
fill: currentColor;
}
.menu-bar-items {
display: flex;
align-items: center;
gap: 8px;
}
/* Header layout */
.inside-header {
flex-direction: column !important;
align-items: stretch !important;
padding: 14px 20px !important;
gap: 6px;
}
.site-branding {
max-width: 100% !important;
text-align: left;
}
.site-title {
font-size: 18px !important;
line-height: 1.1 !important;
}
.site-description {
font-size: 11px !important;
}
/* Slide-out menu (panel that opens when hamburger clicked) */
#generate-slideout-menu,
.slideout-navigation {
background: var(--d2-cream) !important;
}
.slideout-navigation .main-nav ul li a,
#generate-slideout-menu .main-nav ul li a {
color: var(--d2-navy) !important;
font-family: 'Cormorant Garamond', serif !important;
font-size: 18px !important;
font-weight: 600 !important;
padding: 16px 22px !important;
border-bottom: 1px dashed rgba(184,137,62,.3);
}
.slideout-navigation .main-nav ul ul li a,
#generate-slideout-menu .main-nav ul ul li a {
font-family: 'Inter', sans-serif !important;
font-size: 14px !important;
font-weight: 400 !important;
padding: 12px 22px 12px 40px !important;
color: var(--d2-anthracite) !important;
position: relative;
}
.slideout-navigation .main-nav ul ul li a::before,
#generate-slideout-menu .main-nav ul ul li a::before {
content: "›";
position: absolute;
left: 26px;
color: var(--d2-gold);
font-weight: 700;
}
/* Mobile CTA — full-width bouton bleu nuit */
.slideout-navigation .main-nav ul li.menu-cta a,
#generate-slideout-menu .main-nav ul li.menu-cta a,
.slideout-navigation .main-nav ul li.menu-item-cta a,
#generate-slideout-menu .main-nav ul li.menu-item-cta a {
background: var(--d2-navy) !important;
color: var(--d2-cream) !important;
text-align: center !important;
margin: 16px 22px !important;
border-radius: 2px;
padding: 14px 20px !important;
font-family: 'Inter', sans-serif !important;
border-bottom: none !important;
}
.slideout-navigation .main-nav ul li.menu-cta a::before,
#generate-slideout-menu .main-nav ul li.menu-cta a::before {
content: "APPELER LE CABINET";
display: block;
font-size: 10px;
color: var(--d2-gold);
letter-spacing: 2px;
margin-bottom: 4px;
font-weight: 600;
background: none !important;
-webkit-mask: none !important;
mask: none !important;
width: auto !important;
height: auto !important;
position: static !important;
transform: none !important;
}
/* Disable desktop ::after on mobile nav items */
.slideout-navigation .main-nav > ul > li > a::after,
#generate-slideout-menu .main-nav > ul > li > a::after {
display: none !important;
}
}
/* Keep desktop nav hidden on small screens, mobile nav hidden on large screens */
@media (min-width: 769px) {
.main-navigation.mobile-menu-control-wrapper {
display: none !important;
}
}
/* ============================================================
MOBILE MENU FORCE-SHOW (override GP defaults)
============================================================ */
@media (max-width: 768px) {
/* Force all mobile menu wrappers and toggles visible */
nav.main-navigation.mobile-menu-control-wrapper,
.main-navigation.mobile-menu-control-wrapper {
display: block !important;
visibility: visible !important;
opacity: 1 !important;
height: auto !important;
background: var(--d2-cream) !important;
border-top: 1px solid var(--d2-divider);
border-bottom: 1px solid var(--d2-divider);
width: 100%;
}
/* Force button visible — full styling */
.mobile-menu-control-wrapper .menu-toggle,
nav.main-navigation .menu-toggle {
display: flex !important;
visibility: visible !important;
opacity: 1 !important;
align-items: center !important;
justify-content: center !important;
background: var(--d2-cream) !important;
color: var(--d2-navy) !important;
border: none !important;
padding: 14px 20px !important;
cursor: pointer !important;
font-family: 'Inter', sans-serif !important;
font-size: 14px !important;
font-weight: 600 !important;
text-transform: uppercase !important;
letter-spacing: 1.5px !important;
width: 100% !important;
min-height: 50px !important;
box-sizing: border-box !important;
}
/* Add visible "Menu" label next to icon */
.mobile-menu-control-wrapper .menu-toggle::after {
content: "Menu";
display: inline-block;
margin-left: 10px;
font-size: 14px;
color: var(--d2-navy);
letter-spacing: 1.5px;
}
/* Hamburger icon visible */
.menu-toggle .gp-icon,
.menu-toggle svg {
display: inline-block !important;
width: 22px !important;
height: 22px !important;
fill: var(--d2-navy) !important;
color: var(--d2-navy) !important;
}
.menu-toggle .gp-icon svg {
display: inline-block !important;
width: 22px !important;
height: 22px !important;
fill: var(--d2-navy) !important;
}
/* Hide the desktop nav on mobile */
body .main-navigation.sub-menu-right {
display: none !important;
}
/* When menu is open, show close icon instead of bars */
.menu-toggle[aria-expanded="true"] {
background: var(--d2-navy) !important;
color: var(--d2-cream) !important;
}
.menu-toggle[aria-expanded="true"] .gp-icon svg,
.menu-toggle[aria-expanded="true"] svg {
fill: var(--d2-cream) !important;
}
.menu-toggle[aria-expanded="true"]::after {
color: var(--d2-cream);
}
}
/* Hide mobile menu wrapper on desktop */
@media (min-width: 769px) {
nav.main-navigation.mobile-menu-control-wrapper,
.main-navigation.mobile-menu-control-wrapper {
display: none !important;
}
}
/* Hide the close X icon outside slideout (it belongs INSIDE the slideout panel) */
@media (max-width: 768px) {
/* When slideout is closed, hide close icon shown stand-alone */
.slideout-navigation:not(.is-open) .menu-toggle,
body:not(.slide-opened) .slideout-navigation .slideout-exit,
body:not(.slide-opened) .slideout-navigation > .menu-toggle {
display: none !important;
}
/* Hide the secondary nav (3rd one) on the page (slideout-navigation) by default */
.slideout-navigation {
display: none !important;
}
/* GP toggles slide-opened on body when menu is opened — show slideout then */
body.slide-opened .slideout-navigation {
display: block !important;
}
}
/* ============ FORCE HIDE EVERYTHING NOT mobile-menu-control-wrapper ON MOBILE ============ */
@media (max-width: 768px) {
/* Hide slideout-navigation completely until JS opens it */
body:not(.slide-opened) #generate-slideout-menu,
body:not(.slide-opened) nav.slideout-navigation,
body:not(.slide-opened) .slideout-navigation {
visibility: hidden !important;
opacity: 0 !important;
position: fixed !important;
top: 0;
left: -100%;
transform: translateX(-100%) !important;
pointer-events: none !important;
}
/* Hide the slideout-exit button completely unless inside an open slideout */
body:not(.slide-opened) .slideout-exit,
.slideout-exit:not(.is-visible) {
display: none !important;
visibility: hidden !important;
}
/* Hide sub-menu-right nav (desktop nav) */
nav.main-navigation.sub-menu-right {
display: none !important;
visibility: hidden !important;
}
}
/* ============ NUKE SLIDEOUT-EXIT BUTTON ON MOBILE WHEN MENU NOT OPEN ============ */
@media (max-width: 768px) {
/* Three layers of hiding */
body:not(.slide-opened) .slideout-exit,
html:not(.slide-opened-html) .slideout-exit,
.slideout-exit {
display: none !important;
}
body.slide-opened .slideout-exit {
display: inline-flex !important;
position: absolute !important;
top: 16px !important;
right: 16px !important;
}
/* Position the slideout off-screen by default */
body:not(.slide-opened) #generate-slideout-menu {
position: fixed !important;
top: 0 !important;
left: -1000px !important;
width: 0 !important;
height: 0 !important;
overflow: hidden !important;
visibility: hidden !important;
pointer-events: none !important;
}
/* When opened, restore */
body.slide-opened #generate-slideout-menu {
position: fixed !important;
top: 0 !important;
left: 0 !important;
width: 280px !important;
height: 100vh !important;
visibility: visible !important;
overflow-y: auto !important;
pointer-events: auto !important;
z-index: 9999 !important;
background: var(--d2-cream) !important;
box-shadow: 4px 0 16px rgba(0,0,0,.18);
}
body.slide-opened #generate-slideout-menu .slideout-exit {
display: inline-flex !important;
background: transparent !important;
color: var(--d2-navy) !important;
}
}
/* ============================================================
FIX: GP menu-toggle SVG path swap (bars/X based on aria-expanded)
============================================================ */
/* Hide the close-X SVG (2nd child) by default */
.gp-icon.icon-menu-bars svg:nth-of-type(2),
.menu-toggle .gp-icon.icon-menu-bars svg:nth-of-type(2) {
display: none !important;
}
/* When toggle is expanded, swap: show X, hide bars */
.menu-toggle[aria-expanded="true"] .gp-icon.icon-menu-bars svg:nth-of-type(1) {
display: none !important;
}
.menu-toggle[aria-expanded="true"] .gp-icon.icon-menu-bars svg:nth-of-type(2) {
display: inline-block !important;
}
/* ============ FIX: remove "Menu" label next to hamburger ============ */
@media (max-width: 768px) {
/* Kill the ::after "Menu" text */
.mobile-menu-control-wrapper .menu-toggle::after,
nav.main-navigation .menu-toggle::after {
content: none !important;
display: none !important;
}
/* Compact the hamburger button — single line */
.mobile-menu-control-wrapper .menu-toggle {
padding: 12px 18px !important;
min-height: auto !important;
justify-content: flex-end !important;
font-size: 0 !important; /* hide screen-reader text artifact */
}
.mobile-menu-control-wrapper .menu-toggle .gp-icon,
.mobile-menu-control-wrapper .menu-toggle .gp-icon svg {
font-size: 22px !important;
width: 24px !important;
height: 24px !important;
}
}
/* ============ MOBILE HAMBURGER BUTTON — CLEAN, NO LABEL, CENTERED ============ */
@media (max-width: 768px) {
/* Remove any pseudo-element label */
.mobile-menu-control-wrapper .menu-toggle::after,
.mobile-menu-control-wrapper .menu-toggle::before,
nav.main-navigation .menu-toggle::after,
nav.main-navigation .menu-toggle::before {
content: none !important;
display: none !important;
}
/* Wrapper: no inner divider */
nav.main-navigation.mobile-menu-control-wrapper {
border-top: none !important;
border-bottom: 1px solid var(--d2-divider) !important;
background: var(--d2-cream) !important;
}
/* Button: clean, single line, centered, no label */
.mobile-menu-control-wrapper .menu-toggle {
display: flex !important;
align-items: center !important;
justify-content: center !important;
background: var(--d2-cream) !important;
border: none !important;
padding: 14px !important;
width: 100% !important;
min-height: 50px !important;
font-size: 0 !important;
color: var(--d2-navy) !important;
}
.mobile-menu-control-wrapper .menu-toggle .gp-icon {
display: inline-flex !important;
align-items: center;
justify-content: center;
width: 24px !important;
height: 24px !important;
color: var(--d2-navy) !important;
}
.mobile-menu-control-wrapper .menu-toggle .gp-icon svg {
width: 24px !important;
height: 24px !important;
fill: currentColor !important;
}
/* Slideout panel: full menu styling */
body.slide-opened #generate-slideout-menu {
width: 280px !important;
background: var(--d2-cream) !important;
padding: 0 !important;
}
body.slide-opened #generate-slideout-menu .inside-navigation {
padding: 60px 0 20px !important;
margin: 0 !important;
}
body.slide-opened #generate-slideout-menu .slideout-exit {
position: absolute !important;
top: 16px !important;
right: 16px !important;
background: transparent !important;
color: var(--d2-navy) !important;
border: none !important;
width: 36px !important;
height: 36px !important;
padding: 6px !important;
display: inline-flex !important;
align-items: center;
justify-content: center;
cursor: pointer;
}
body.slide-opened #generate-slideout-menu .slideout-exit svg {
width: 22px;
height: 22px;
fill: currentColor;
}
/* Menu items inside slideout */
body.slide-opened #generate-slideout-menu ul.menu,
body.slide-opened #generate-slideout-menu ul.sf-menu {
list-style: none;
padding: 0;
margin: 0;
}
body.slide-opened #generate-slideout-menu .main-nav ul li {
border-bottom: 1px dashed rgba(184,137,62,.25);
}
body.slide-opened #generate-slideout-menu .main-nav ul li a {
display: block;
color: var(--d2-navy) !important;
font-family: 'Cormorant Garamond', serif !important;
font-size: 18px !important;
font-weight: 600 !important;
padding: 16px 22px !important;
text-decoration: none;
}
body.slide-opened #generate-slideout-menu .main-nav ul ul li a {
font-family: 'Inter', sans-serif !important;
font-size: 14px !important;
font-weight: 400 !important;
padding: 12px 22px 12px 40px !important;
color: var(--d2-anthracite) !important;
position: relative;
}
body.slide-opened #generate-slideout-menu .main-nav ul ul li a::before {
content: "›" !important;
position: absolute !important;
left: 26px !important;
color: var(--d2-gold) !important;
font-weight: 700 !important;
}
/* Mobile CTA button */
body.slide-opened #generate-slideout-menu .main-nav ul li.menu-cta a {
background: var(--d2-navy) !important;
color: var(--d2-cream) !important;
margin: 18px 22px !important;
padding: 14px 18px !important;
border-radius: 2px !important;
text-align: center;
text-transform: none;
border-bottom: none !important;
}
body.slide-opened #generate-slideout-menu .main-nav ul li.menu-cta a::before {
content: "APPELER LE CABINET" !important;
display: block !important;
font-size: 10px;
color: var(--d2-gold);
letter-spacing: 2px;
margin-bottom: 4px;
font-weight: 600;
position: static !important;
background: none !important;
}
}
/* ============ SLIDEOUT FINAL POLISH ============ */
@media (max-width: 768px) {
/* No uppercase on top-level items */
body.slide-opened #generate-slideout-menu .main-nav > ul > li > a {
text-transform: none !important;
text-align: center !important;
letter-spacing: 0.3px !important;
}
/* Force ALL sub-menus visible (no hover/expand on mobile) */
body.slide-opened #generate-slideout-menu .main-nav ul ul.sub-menu,
body.slide-opened #generate-slideout-menu .main-nav ul ul {
display: block !important;
visibility: visible !important;
opacity: 1 !important;
position: static !important;
width: 100% !important;
box-shadow: none !important;
border: none !important;
background: rgba(11,59,90,.025) !important;
padding: 0 !important;
margin: 0 !important;
transform: none !important;
left: auto !important;
top: auto !important;
}
/* Hide the dropdown chevron toggle on mobile (sub-items always visible) */
body.slide-opened #generate-slideout-menu .dropdown-menu-toggle {
display: none !important;
}
/* Sub-item styling */
body.slide-opened #generate-slideout-menu .main-nav ul ul li {
border-bottom: 1px dotted rgba(184,137,62,.2) !important;
border-top: none !important;
}
body.slide-opened #generate-slideout-menu .main-nav ul ul li:last-child {
border-bottom: none !important;
}
body.slide-opened #generate-slideout-menu .main-nav ul ul li a {
text-align: left !important;
padding: 12px 22px 12px 44px !important;
font-family: 'Inter', sans-serif !important;
font-size: 14px !important;
font-weight: 400 !important;
color: var(--d2-anthracite) !important;
text-transform: none !important;
position: relative;
}
body.slide-opened #generate-slideout-menu .main-nav ul ul li a::before {
content: "›" !important;
position: absolute !important;
left: 28px !important;
top: 12px !important;
color: var(--d2-gold) !important;
font-weight: 700 !important;
font-size: 14px !important;
}
}
/* ============================================================
FIX MOBILE — burger top-right + footer padding (2026-05-04)
============================================================ */
@media (max-width: 768px) {
/* 1) Header on one row: title left, burger right */
.site-header.has-inline-mobile-toggle .inside-header {
flex-direction: row !important;
flex-wrap: nowrap !important;
align-items: center !important;
justify-content: space-between !important;
gap: 12px !important;
}
.site-header.has-inline-mobile-toggle .site-branding {
flex: 1 1 auto !important;
min-width: 0 !important;
max-width: none !important;
}
/* 2) The mobile-menu-control-wrapper sits INSIDE .inside-header.
Shrink it to the burger size, kill its border + background. */
.inside-header > nav.main-navigation.mobile-menu-control-wrapper,
.inside-header > #mobile-menu-control-wrapper {
flex: 0 0 auto !important;
width: auto !important;
max-width: none !important;
margin: 0 !important;
padding: 0 !important;
background: transparent !important;
border: none !important;
box-shadow: none !important;
}
/* 3) The burger button itself — clean, compact, navy icon */
.inside-header .mobile-menu-control-wrapper .menu-toggle,
.inside-header .menu-toggle[data-nav] {
width: auto !important;
min-height: 0 !important;
margin: 0 !important;
padding: 8px 10px !important;
background: transparent !important;
border: none !important;
color: var(--d2-navy) !important;
font-size: 0 !important;
line-height: 1 !important;
display: inline-flex !important;
align-items: center !important;
justify-content: center !important;
}
.inside-header .mobile-menu-control-wrapper .menu-toggle:hover,
.inside-header .mobile-menu-control-wrapper .menu-toggle:focus {
background: rgba(184,137,62,.10) !important;
}
.inside-header .mobile-menu-control-wrapper .menu-toggle .gp-icon,
.inside-header .mobile-menu-control-wrapper .menu-toggle .gp-icon svg {
width: 28px !important;
height: 28px !important;
color: var(--d2-navy) !important;
fill: currentColor !important;
}
/* 4) Footer mobile padding — content stays away from screen edges */
.footer-widgets .inside-footer-widgets,
.footer-widgets-container {
padding-left: 24px !important;
padding-right: 24px !important;
}
.footer-widgets .inside-footer-widgets > .footer-widget-container,
.footer-widgets .inside-footer-widgets > .widget {
padding-left: 0 !important;
padding-right: 0 !important;
}
}
/* ============================================================
HOME REDESIGN — encarts visuels (2026-05-04)
Préfixe: .cm- (Camille Masson)
============================================================ */
/* ---------- HERO 2-COL : H1+CTA gauche / portrait droite ---------- */
.cm-hero {
display: grid;
grid-template-columns: 1.8fr 1fr;
gap: 56px;
align-items: center;
margin: 24px 0 48px;
}
.cm-hero-left { align-self: center; }
.cm-hero-left h1 {
margin: 0 0 22px;
font-size: 44px;
line-height: 1.1;
letter-spacing: -0.5px;
}
.cm-hero-lead {
margin: 0 0 28px;
font-family: 'Inter', sans-serif;
font-size: 16px;
line-height: 1.65;
color: var(--d2-anthracite);
max-width: 620px;
}
.cm-hero-actions {
display: flex;
flex-wrap: wrap;
gap: 14px;
margin-top: 4px;
}
.cm-hero-btn {
display: inline-flex !important;
align-items: center !important;
justify-content: center !important;
gap: 10px !important;
padding: 14px 24px !important;
border-radius: 2px;
font-family: 'Inter', sans-serif;
font-size: 14px;
font-weight: 600;
letter-spacing: 0.5px;
text-decoration: none !important;
line-height: 1 !important;
white-space: nowrap;
transition: background .2s, color .2s, transform .2s, border-color .2s;
}
.cm-hero-btn svg {
width: 16px !important; height: 16px !important;
flex-shrink: 0; display: inline-block !important; vertical-align: middle !important;
}
.cm-hero-btn-primary {
background: var(--d2-gold);
color: var(--d2-cream) !important;
}
.cm-hero-btn-primary:hover {
background: #C9A05A;
color: white !important;
transform: translateY(-1px);
}
.cm-hero-btn-secondary {
background: transparent;
color: var(--d2-navy) !important;
border: 1px solid rgba(11,59,90,.30);
}
.cm-hero-btn-secondary:hover {
border-color: var(--d2-gold);
color: var(--d2-gold) !important;
background: rgba(184,137,62,.06);
}
.cm-hero-portrait {
margin: 0;
border-radius: 4px;
overflow: hidden;
background: var(--d2-cream);
box-shadow: 0 14px 36px rgba(11,59,90,.14);
position: relative;
align-self: center;
max-width: 320px;
justify-self: end;
}
.cm-hero-portrait::after {
content: "";
position: absolute;
top: 0; left: 0;
width: 4px;
height: 72px;
background: var(--d2-gold);
z-index: 2;
}
.cm-hero-portrait img {
width: 100%;
height: auto;
display: block;
}
/* Intro text sits below the hero, full width */
.cm-intro-below {
margin: 0 0 56px;
max-width: 820px;
font-size: 17px;
line-height: 1.65;
color: var(--d2-anthracite);
text-align: justify;
}
.cm-intro-below p { margin: 0; }
.cm-hero-lead { text-align: justify; }
/* Hide the default theme entry-title H1 since we render our own inside .cm-hero */
.page-id-2463 .entry-header,
.page-id-2464 .entry-header,
.page-id-2465 .entry-header,
.page-id-2466 .entry-header,
.page-id-2467 .entry-header,
.page-id-2468 .entry-header,
.page-id-2469 .entry-header,
.page-id-2470 .entry-header,
.page-id-2471 .entry-header,
.page-id-2474 .entry-header,
.page-id-2475 .entry-header,
.page-id-9 .entry-header,
.page-id-500 .entry-header { display: none !important; }
@media (max-width: 900px) {
.cm-hero { grid-template-columns: 1.5fr 1fr; gap: 36px; }
.cm-hero-left h1 { font-size: 36px; }
.cm-hero-portrait { max-width: 260px; }
}
@media (max-width: 700px) {
.cm-hero { grid-template-columns: 1fr; gap: 28px; }
.cm-hero-left { order: 2; }
.cm-hero-portrait { order: 1; max-width: 280px; justify-self: center; }
.cm-hero-left h1 { font-size: 32px; }
.cm-hero-actions { flex-direction: column; align-items: stretch; }
.cm-hero-btn { justify-content: center; }
.cm-hero-lead { font-size: 15px; }
}
/* ---------- HERO BANNER pleine largeur (home) ---------- */
.cm-hero-banner {
position: relative;
width: 100vw;
margin-left: calc(50% - 50vw);
margin-right: calc(50% - 50vw);
margin-top: 0;
margin-bottom: 56px;
border-radius: 0;
overflow: hidden;
min-height: 520px;
display: flex;
align-items: center;
}
.cm-hero-banner-bg {
position: absolute;
inset: 0;
width: 100%;
height: 100%;
object-fit: cover;
display: block;
}
.cm-hero-banner::after {
content: "";
position: absolute;
inset: 0;
background: linear-gradient(110deg, rgba(11,59,90,.88) 0%, rgba(11,59,90,.66) 46%, rgba(11,59,90,.32) 100%);
}
.cm-hero-banner-inner {
position: relative;
z-index: 2;
width: 100%;
max-width: 1140px;
margin: 0 auto;
padding: 66px 30px;
box-sizing: border-box;
color: var(--d2-cream);
}
.cm-hero-banner-inner h1,
.cm-hero-banner-lead { max-width: 580px; }
.cm-hero-banner-eyebrow {
display: inline-block;
margin-bottom: 14px;
font-family: 'Inter', sans-serif;
font-size: 12px;
font-weight: 600;
letter-spacing: 1.8px;
text-transform: uppercase;
color: var(--d2-gold);
}
.cm-hero-banner-bar {
width: 54px;
height: 3px;
background: var(--d2-gold);
margin-bottom: 22px;
}
.cm-hero-banner-inner h1 {
margin: 0 0 18px;
font-size: 50px;
line-height: 1.12;
letter-spacing: -0.5px;
color: var(--d2-cream);
}
.cm-hero-banner-lead {
margin: 0 0 28px;
font-family: 'Inter', sans-serif;
font-size: 16.5px;
line-height: 1.62;
color: rgba(248,247,245,.92);
max-width: 560px;
}
.cm-hero-banner .cm-hero-actions { margin-top: 0; }
.cm-hero-banner .cm-hero-btn-secondary {
color: var(--d2-cream) !important;
border-color: rgba(248,247,245,.55);
background: transparent;
}
.cm-hero-banner .cm-hero-btn-secondary:hover {
border-color: var(--d2-gold);
color: var(--d2-gold) !important;
background: rgba(248,247,245,.08);
}
@media (max-width: 900px) {
.cm-hero-banner { min-height: 420px; }
.cm-hero-banner-inner { padding: 44px 34px; }
.cm-hero-banner-inner h1 { font-size: 38px; }
}
@media (max-width: 700px) {
.cm-hero-banner { min-height: 0; }
.cm-hero-banner-inner { padding: 36px 22px; max-width: 100%; }
.cm-hero-banner-inner h1 { font-size: 27px; }
.cm-hero-banner::after { background: linear-gradient(180deg, rgba(11,59,90,.82) 0%, rgba(11,59,90,.74) 100%); }
.cm-hero-banner .cm-hero-actions { flex-direction: column; align-items: stretch; }
.cm-hero-banner .cm-hero-btn { justify-content: center; }
}
/* Home : le hero banner colle au header (pas d'espace blanc en haut) */
.page-id-2463 .site-content,
.page-id-2463 .inside-article { padding-top: 0; }
.page-id-2463 .entry-content { margin-top: 0; }
/* ---------- VALEURS — 3 messages cles (home) ---------- */
.cm-values {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 20px;
margin: 40px 0 64px;
}
.cm-value {
background: var(--d2-cream-soft);
border: 1px solid rgba(11,59,90,.10);
border-radius: 4px;
padding: 30px 26px;
}
.cm-value-icon {
width: 40px;
height: 40px;
color: var(--d2-gold);
margin-bottom: 16px;
}
.cm-value-icon svg { width: 100%; height: 100%; display: block; }
.cm-value h3 {
font-family: 'Cormorant Garamond', serif;
font-size: 23px;
font-weight: 600;
color: var(--d2-navy);
margin: 0 0 10px;
}
.cm-value p {
font-family: 'Inter', sans-serif;
font-size: 14.5px;
line-height: 1.6;
color: var(--d2-anthracite);
margin: 0;
}
@media (max-width: 800px) {
.cm-values { grid-template-columns: 1fr; }
}
/* ---------- Home : cartes d'expertise (4+3 centré) + avocats centrés ---------- */
.page-id-2463 .cm-cards { display: flex; flex-wrap: wrap; justify-content: center; gap: 16px; }
.page-id-2463 .cm-cards > .cm-card { flex: 0 1 calc(25% - 12px); }
.page-id-2463 .cm-cards-duo { gap: 24px; }
.page-id-2463 .cm-cards-duo > .cm-card { flex: 0 1 340px; max-width: 380px; }
@media (max-width: 1040px) {
.page-id-2463 .cm-cards > .cm-card { flex: 0 1 calc(33.333% - 11px); }
}
@media (max-width: 720px) {
.page-id-2463 .cm-cards > .cm-card,
.page-id-2463 .cm-cards-duo > .cm-card { flex: 0 1 100%; max-width: none; }
}
/* ---------- STAT BLOCK (3 colonnes) ---------- */
.cm-stats {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 0;
margin: 56px 0;
background: var(--d2-cream);
border: 1px solid rgba(184,137,62,.25);
border-radius: 4px;
overflow: hidden;
}
.cm-stat {
padding: 36px 28px;
text-align: center;
border-right: 1px solid rgba(184,137,62,.18);
}
.cm-stat:last-child { border-right: none; }
.cm-stat-number {
font-family: 'Cormorant Garamond', serif;
font-size: 52px;
font-weight: 600;
color: var(--d2-gold);
line-height: 1;
letter-spacing: -1px;
display: block;
margin-bottom: 10px;
}
.cm-stat-label {
font-family: 'Inter', sans-serif;
font-size: 13px;
color: var(--d2-anthracite);
text-transform: uppercase;
letter-spacing: 1.2px;
line-height: 1.5;
}
/* ---------- TWO-COLUMN TEXT + IMAGE ---------- */
.cm-split {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 48px;
align-items: center;
margin: 64px 0;
}
.cm-split-image {
border-radius: 4px;
overflow: hidden;
box-shadow: 0 8px 28px rgba(11,59,90,.10);
max-width: 420px;
justify-self: end;
}
.cm-split-image img {
width: 100%;
height: 280px;
object-fit: cover;
display: block;
}
.cm-split-text p:last-child { margin-bottom: 0; }
/* ---------- EXPERTISE CARDS (4 colonnes) ---------- */
.cm-cards {
display: grid;
grid-template-columns: repeat(4, 1fr);
gap: 20px;
margin: 40px 0 64px;
}
.cm-card {
background: white;
border: 1px solid rgba(11,59,90,.12);
border-top: 3px solid var(--d2-gold);
border-radius: 4px;
padding: 28px 22px 24px;
display: flex;
flex-direction: column;
transition: transform .25s, box-shadow .25s, border-color .25s;
}
.cm-card:hover {
transform: translateY(-3px);
box-shadow: 0 14px 32px rgba(11,59,90,.10);
border-top-color: var(--d2-navy);
}
.cm-card-icon {
width: 44px;
height: 44px;
margin-bottom: 18px;
color: var(--d2-navy);
}
.cm-card-icon svg { width: 100%; height: 100%; display: block; }
.cm-card-title {
font-family: 'Cormorant Garamond', serif;
font-size: 22px;
font-weight: 600;
color: var(--d2-navy);
line-height: 1.2;
margin: 0 0 12px;
}
.cm-card-desc {
font-family: 'Inter', sans-serif;
font-size: 14px;
color: var(--d2-anthracite);
line-height: 1.55;
margin: 0 0 18px;
flex: 1;
}
.cm-card-link {
font-family: 'Inter', sans-serif;
font-size: 13px;
font-weight: 600;
color: var(--d2-gold);
text-transform: uppercase;
letter-spacing: 1.2px;
text-decoration: none;
display: inline-flex;
align-items: center;
gap: 6px;
}
.cm-card-link::after {
content: "›";
font-size: 16px;
transition: transform .2s;
}
.cm-card:hover .cm-card-link { color: var(--d2-navy); }
.cm-card:hover .cm-card-link::after { transform: translateX(4px); }
/* ---------- MANDATS (timeline verticale) ---------- */
.cm-mandates {
margin: 48px 0;
border-top: 1px solid rgba(11,59,90,.12);
}
.cm-mandate {
display: grid;
grid-template-columns: 1fr 200px;
align-items: center;
gap: 24px;
padding: 22px 0;
border-bottom: 1px solid rgba(11,59,90,.10);
position: relative;
}
.cm-mandate::before {
content: "";
position: absolute;
left: 0;
top: 22px;
bottom: 22px;
width: 3px;
background: var(--d2-gold);
opacity: 0;
transition: opacity .2s;
}
.cm-mandate:hover { padding-left: 18px; }
.cm-mandate:hover::before { opacity: 1; }
.cm-mandate { transition: padding-left .25s; }
.cm-mandate-info { display: block; }
.cm-mandate-title {
display: block;
font-family: 'Cormorant Garamond', serif;
font-size: 19px;
font-weight: 600;
color: var(--d2-navy);
line-height: 1.3;
margin: 0;
}
.cm-mandate-org {
display: block;
font-family: 'Inter', sans-serif;
font-size: 13px;
color: var(--d2-sage);
font-style: italic;
margin-top: 3px;
text-transform: none;
letter-spacing: 0;
line-height: 1.4;
}
.cm-mandate-date {
font-family: 'Inter', sans-serif;
font-size: 12px;
font-weight: 600;
color: var(--d2-gold);
text-transform: uppercase;
letter-spacing: 1.2px;
white-space: nowrap;
text-align: right;
justify-self: end;
}
/* ---------- WIDE IMAGE BAND ---------- */
.cm-wide-image {
margin: 56px auto;
max-width: 640px;
border-radius: 4px;
overflow: hidden;
box-shadow: 0 8px 28px rgba(11,59,90,.10);
position: relative;
}
.cm-wide-image img {
width: 100%;
height: 320px;
object-fit: cover;
display: block;
}
.cm-wide-image figcaption {
position: absolute;
bottom: 16px;
left: 18px;
right: 18px;
font-family: 'Inter', sans-serif;
font-size: 12px;
color: white;
text-shadow: 0 2px 12px rgba(0,0,0,.7);
font-style: italic;
line-height: 1.4;
}
/* ---------- CTA FINAL (encart navy) ---------- */
.cm-cta {
background: var(--d2-navy);
color: var(--d2-cream);
padding: 56px 48px;
margin: 72px 0 24px;
border-radius: 4px;
position: relative;
}
.cm-cta::before {
content: "";
position: absolute;
top: 0; left: 0;
width: 60px;
height: 3px;
background: var(--d2-gold);
}
.cm-cta-title {
font-family: 'Cormorant Garamond', serif;
font-size: 36px;
font-weight: 600;
color: var(--d2-cream);
line-height: 1.2;
margin: 0 0 16px;
}
.cm-cta-text {
font-family: 'Inter', sans-serif;
font-size: 16px;
color: rgba(248,247,245,.85);
line-height: 1.6;
margin: 0 0 32px;
max-width: 720px;
}
.cm-cta-actions {
display: flex;
flex-wrap: wrap;
gap: 14px;
}
.cm-cta-btn {
display: inline-flex !important;
align-items: center !important;
justify-content: center !important;
gap: 10px !important;
padding: 14px 24px !important;
border-radius: 2px;
font-family: 'Inter', sans-serif;
font-size: 14px;
font-weight: 600;
letter-spacing: 0.5px;
text-decoration: none !important;
line-height: 1 !important;
white-space: nowrap;
transition: background .2s, color .2s, transform .2s;
}
.cm-cta-btn > * { vertical-align: middle; }
.cm-cta-btn-primary {
background: var(--d2-gold);
color: var(--d2-cream);
}
.cm-cta-btn-primary:hover {
background: #C9A05A;
color: white;
transform: translateY(-1px);
}
.cm-cta-btn-secondary {
background: transparent;
color: var(--d2-cream);
border: 1px solid rgba(248,247,245,.35);
}
.cm-cta-btn-secondary:hover {
background: rgba(248,247,245,.08);
border-color: var(--d2-gold);
color: var(--d2-gold);
}
.cm-cta-btn svg {
width: 16px !important;
height: 16px !important;
flex-shrink: 0;
display: inline-block !important;
vertical-align: middle !important;
}
/* ---------- CONTACT FORM ---------- */
.cm-contact-form {
background: white;
padding: 32px 36px 28px;
border: 1px solid rgba(11,59,90,.10);
border-radius: 4px;
margin: 24px 0;
}
.cm-form-row {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 18px;
margin-bottom: 16px;
}
.cm-form-field { margin-bottom: 16px; display: block; }
.cm-form-field label {
display: block;
font-family: 'Inter', sans-serif;
font-size: 13px;
font-weight: 600;
color: var(--d2-navy);
margin-bottom: 6px;
letter-spacing: 0.2px;
}
.cm-form-required { color: var(--d2-gold); font-weight: 700; margin-left: 2px; }
.cm-form-optional { color: var(--d2-sage); font-weight: 400; font-style: italic; font-size: 11px; }
.cm-contact-form input[type="text"],
.cm-contact-form input[type="email"],
.cm-contact-form input[type="tel"],
.cm-contact-form select,
.cm-contact-form textarea {
width: 100% !important;
padding: 11px 14px !important;
font-family: 'Inter', sans-serif !important;
font-size: 14px !important;
color: var(--d2-anthracite) !important;
background: var(--d2-cream) !important;
border: 1px solid rgba(11,59,90,.20) !important;
border-radius: 3px !important;
transition: border-color .2s, background .2s !important;
box-sizing: border-box;
}
.cm-contact-form input:focus,
.cm-contact-form select:focus,
.cm-contact-form textarea:focus {
outline: none !important;
border-color: var(--d2-gold) !important;
background: white !important;
}
.cm-contact-form textarea { resize: vertical; min-height: 140px; }
.cm-form-consent label {
display: flex !important;
align-items: flex-start;
gap: 10px;
font-weight: 400;
font-size: 13px;
line-height: 1.5;
color: var(--d2-anthracite);
}
.cm-form-consent input[type="checkbox"] {
margin-top: 3px;
flex-shrink: 0;
accent-color: var(--d2-gold);
width: 16px; height: 16px;
}
.cm-form-consent a { color: var(--d2-navy); }
.cm-form-field-error {
display: block;
margin-top: 5px;
font-family: 'Inter', sans-serif;
font-size: 12px;
color: #B23A48;
}
.cm-form-error {
padding: 14px 18px;
background: #FEF2F4;
border-left: 3px solid #B23A48;
color: #6E1F2A;
font-family: 'Inter', sans-serif;
font-size: 14px;
margin-bottom: 18px;
border-radius: 0 3px 3px 0;
}
.cm-form-success {
padding: 22px 26px;
background: rgba(184,137,62,.08);
border-left: 3px solid var(--d2-gold);
color: var(--d2-anthracite);
font-family: 'Inter', sans-serif;
font-size: 14px;
line-height: 1.55;
border-radius: 0 3px 3px 0;
}
.cm-form-success strong {
display: block;
font-family: 'Cormorant Garamond', serif;
font-size: 19px;
color: var(--d2-navy);
margin-bottom: 6px;
}
.cm-form-submit {
display: inline-flex !important;
align-items: center !important;
gap: 10px !important;
padding: 14px 28px !important;
background: var(--d2-gold) !important;
color: var(--d2-cream) !important;
border: none !important;
border-radius: 2px !important;
font-family: 'Inter', sans-serif !important;
font-size: 14px !important;
font-weight: 600 !important;
letter-spacing: 0.4px !important;
cursor: pointer;
transition: background .2s, transform .2s;
margin-top: 8px;
text-transform: none !important;
line-height: 1 !important;
min-height: 0 !important;
}
.cm-form-submit:hover { background: #C9A05A !important; transform: translateY(-1px); color: white !important; }
.cm-form-submit svg { width: 16px !important; height: 16px !important; flex-shrink: 0; }
/* ---------- GOOGLE MAPS EMBED (page Contact) ---------- */
.cm-map-wrap {
margin: 32px 0;
border-radius: 4px;
overflow: hidden;
box-shadow: 0 8px 24px rgba(11,59,90,.10);
position: relative;
}
.cm-map-wrap::before {
content: "";
position: absolute;
top: 0; left: 0;
width: 4px;
height: 50px;
background: var(--d2-gold);
z-index: 2;
}
.cm-map-wrap iframe {
width: 100%;
height: 380px;
display: block;
border: none;
filter: grayscale(0.15) contrast(1.02);
}
@media (max-width: 700px) {
.cm-form-row { grid-template-columns: 1fr; gap: 0; }
.cm-contact-form { padding: 24px 22px 22px; }
.cm-map-wrap iframe { height: 280px; }
}
/* ---------- BIG CARDS (pages expertises : sous-domaines/sections) ---------- */
.cm-bigcards {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 22px;
margin: 32px 0 48px;
}
.cm-bigcard {
background: white;
border: 1px solid rgba(11,59,90,.10);
border-left: 3px solid var(--d2-gold);
border-radius: 4px;
padding: 26px 28px 24px;
display: flex;
flex-direction: column;
transition: border-color .25s, box-shadow .25s, transform .25s;
}
.cm-bigcard:hover {
border-color: var(--d2-navy);
border-left-color: var(--d2-navy);
box-shadow: 0 12px 28px rgba(11,59,90,.10);
transform: translateY(-2px);
}
.cm-bigcard-eyebrow {
font-family: 'Inter', sans-serif;
font-size: 11px;
font-weight: 600;
color: var(--d2-gold);
text-transform: uppercase;
letter-spacing: 1.5px;
margin-bottom: 6px;
display: block;
}
.cm-bigcard-title {
font-family: 'Cormorant Garamond', serif;
font-size: 22px;
font-weight: 600;
color: var(--d2-navy);
margin: 0 0 12px;
line-height: 1.25;
letter-spacing: -0.2px;
}
.cm-bigcard-desc {
font-family: 'Inter', sans-serif;
font-size: 14px;
line-height: 1.6;
color: var(--d2-anthracite);
margin: 0 0 14px;
flex: 1;
}
.cm-bigcard-bullets {
list-style: none;
padding: 0;
margin: 0 0 14px;
}
.cm-bigcard-bullets li {
position: relative;
padding: 4px 0 4px 18px;
font-family: 'Inter', sans-serif;
font-size: 13px;
line-height: 1.5;
color: var(--d2-anthracite);
}
.cm-bigcard-bullets li::before {
content: "›";
position: absolute;
left: 0;
top: 4px;
color: var(--d2-gold);
font-weight: 700;
font-size: 13px;
}
.cm-bigcard-link {
margin-top: auto;
font-family: 'Inter', sans-serif;
font-size: 12px;
font-weight: 600;
color: var(--d2-gold);
text-transform: uppercase;
letter-spacing: 1.2px;
text-decoration: none;
display: inline-flex;
align-items: center;
gap: 6px;
}
.cm-bigcard-link::after { content: "›"; font-size: 14px; transition: transform .2s; }
.cm-bigcard:hover .cm-bigcard-link::after { transform: translateX(4px); }
/* ---------- RESULT CASE CARDS (resultats judiciaires) ---------- */
.cm-cases { display: grid; grid-template-columns: 1fr; gap: 18px; margin: 32px 0 48px; }
.cm-case {
background: white;
border: 1px solid rgba(11,59,90,.12);
border-radius: 4px;
padding: 28px 32px;
display: grid;
grid-template-columns: 180px 1fr;
gap: 36px;
align-items: start;
transition: border-color .25s, box-shadow .25s;
}
.cm-case:hover { border-color: rgba(184,137,62,.50); box-shadow: 0 8px 22px rgba(11,59,90,.06); }
.cm-case-meta {
border-right: 1px solid rgba(184,137,62,.30);
padding-right: 28px;
}
.cm-case-tag {
display: inline-block;
font-family: 'Inter', sans-serif;
font-size: 10px;
font-weight: 700;
color: var(--d2-gold);
text-transform: uppercase;
letter-spacing: 1.6px;
background: rgba(184,137,62,.08);
padding: 5px 10px;
border-radius: 2px;
margin-bottom: 10px;
}
.cm-case-outcome {
font-family: 'Cormorant Garamond', serif;
font-size: 17px;
font-weight: 600;
color: var(--d2-navy);
line-height: 1.3;
margin: 0;
}
.cm-case-body h3 {
font-family: 'Cormorant Garamond', serif;
font-size: 21px;
font-weight: 600;
color: var(--d2-navy);
margin: 0 0 12px;
line-height: 1.25;
}
.cm-case-body p {
font-family: 'Inter', sans-serif;
font-size: 14px;
line-height: 1.65;
color: var(--d2-anthracite);
margin: 0;
}
@media (max-width: 700px) {
.cm-case { grid-template-columns: 1fr; gap: 14px; padding: 22px 22px; }
.cm-case-meta { border-right: none; padding-right: 0; padding-bottom: 14px; border-bottom: 1px solid rgba(184,137,62,.20); }
}
@media (max-width: 700px) { .cm-bigcards { grid-template-columns: 1fr; } }
/* ---------- BLOG ARTICLE LIST CARDS ---------- */
.cm-blog-grid {
display: grid;
grid-template-columns: repeat(2, 1fr);
gap: 22px;
margin: 32px 0 56px;
}
.cm-blog-card {
background: white;
border: 1px solid rgba(11,59,90,.10);
border-radius: 4px;
padding: 26px 28px 22px;
display: flex;
flex-direction: column;
transition: border-color .25s, box-shadow .25s, transform .25s;
}
.cm-blog-card:hover {
border-color: var(--d2-gold);
box-shadow: 0 10px 24px rgba(11,59,90,.08);
transform: translateY(-2px);
}
.cm-blog-cat {
display: inline-block;
font-family: 'Inter', sans-serif;
font-size: 10px;
font-weight: 700;
color: var(--d2-gold);
text-transform: uppercase;
letter-spacing: 1.5px;
margin-bottom: 8px;
}
.cm-blog-title {
font-family: 'Cormorant Garamond', serif;
font-size: 21px;
font-weight: 600;
color: var(--d2-navy);
line-height: 1.25;
margin: 0 0 12px;
}
.cm-blog-title a {
color: inherit;
text-decoration: none;
}
.cm-blog-title a:hover { color: var(--d2-gold); }
.cm-blog-excerpt {
font-family: 'Inter', sans-serif;
font-size: 14px;
line-height: 1.6;
color: var(--d2-anthracite);
margin: 0 0 16px;
flex: 1;
}
.cm-blog-meta {
font-family: 'Inter', sans-serif;
font-size: 12px;
color: var(--d2-sage);
display: flex;
align-items: center;
gap: 8px;
margin-bottom: 4px;
}
.cm-blog-link {
font-family: 'Inter', sans-serif;
font-size: 12px;
font-weight: 600;
color: var(--d2-gold);
text-transform: uppercase;
letter-spacing: 1.2px;
text-decoration: none;
margin-top: auto;
}
.cm-blog-link::after { content: " ›"; }
/* Reduce top spacing on blog index + single posts (GP default = 70px) */
body.blog .site-content,
body.single-post .site-content,
body.blog .site-main,
body.single-post .site-main { padding-top: 24px !important; }
/* ---------- BLOG SINGLE ARTICLE LAYOUT (2-col grid + sidebar) ---------- */
.cm-article-layout {
display: grid;
grid-template-columns: 1fr 320px;
gap: 56px;
max-width: 1180px;
margin: 0 auto;
align-items: start;
}
.cm-article-header {
display: grid;
grid-template-columns: 1fr 280px;
gap: 36px;
align-items: center;
margin-bottom: 32px;
padding-bottom: 24px;
border-bottom: 1px solid rgba(11,59,90,.10);
}
.cm-article-header-text { min-width: 0; }
.cm-article-featured {
margin: 0;
border-radius: 4px;
overflow: hidden;
box-shadow: 0 8px 24px rgba(11,59,90,.12);
position: relative;
}
.cm-article-featured::before {
content: "";
position: absolute;
top: 0; left: 0;
width: 4px;
height: 50px;
background: var(--d2-gold);
z-index: 2;
}
.cm-article-featured img {
width: 100%;
height: 200px;
object-fit: cover;
display: block;
}
.cm-article {
font-family: 'Inter', sans-serif;
min-width: 0;
}
.cm-article-sidebar {
position: sticky;
top: 90px;
display: flex;
flex-direction: column;
gap: 18px;
}
.cm-sidebar-cta {
background: var(--d2-navy);
color: var(--d2-cream);
padding: 28px 26px 26px;
border-radius: 4px;
position: relative;
}
.cm-sidebar-cta::before {
content: "";
position: absolute;
top: 0; left: 0;
width: 50px;
height: 3px;
background: var(--d2-gold);
}
.cm-sidebar-eyebrow {
display: block;
font-family: 'Inter', sans-serif;
font-size: 11px;
font-weight: 600;
color: var(--d2-gold);
text-transform: uppercase;
letter-spacing: 1.5px;
margin-bottom: 10px;
}
.cm-sidebar-title {
font-family: 'Cormorant Garamond', serif;
font-size: 22px;
font-weight: 600;
color: var(--d2-cream);
margin: 0 0 10px;
line-height: 1.25;
}
.cm-sidebar-text {
font-family: 'Inter', sans-serif;
font-size: 13px;
line-height: 1.55;
color: rgba(248,247,245,.85);
margin: 0 0 16px;
}
.cm-sidebar-btn {
display: flex !important;
align-items: center !important;
justify-content: center !important;
gap: 8px !important;
width: 100% !important;
padding: 12px 14px !important;
margin-bottom: 8px;
background: var(--d2-gold) !important;
color: var(--d2-cream) !important;
border-radius: 2px;
font-family: 'Inter', sans-serif !important;
font-size: 13px !important;
font-weight: 600 !important;
letter-spacing: 0.4px !important;
text-decoration: none !important;
transition: background .2s, transform .2s;
}
.cm-sidebar-btn:hover { background: #C9A05A !important; transform: translateY(-1px); color: white !important; }
.cm-sidebar-btn-secondary {
background: transparent !important;
color: var(--d2-cream) !important;
border: 1px solid rgba(248,247,245,.30);
}
.cm-sidebar-btn-secondary:hover {
background: rgba(248,247,245,.06) !important;
border-color: var(--d2-gold);
color: var(--d2-gold) !important;
}
.cm-sidebar-btn svg { width: 14px !important; height: 14px !important; flex-shrink: 0; }
.cm-sidebar-author {
background: var(--d2-cream);
border: 1px solid rgba(184,137,62,.20);
padding: 22px 22px 20px;
border-radius: 4px;
}
.cm-sidebar-author-photo {
width: 64px;
height: 64px;
border-radius: 50%;
background-image: url('https://camillemasson-avocat.fr/wp-content/uploads/2026/05/portrait-maitre-camille-masson-avocat-tours.webp');
background-size: cover;
background-position: center top;
margin-bottom: 12px;
}
.cm-sidebar-author-name {
font-family: 'Cormorant Garamond', serif;
font-size: 18px;
font-weight: 600;
color: var(--d2-navy);
margin: 0 0 2px;
}
.cm-sidebar-author-role {
font-family: 'Inter', sans-serif;
font-size: 12px;
font-style: italic;
color: var(--d2-sage);
margin: 0 0 12px;
}
.cm-sidebar-author-bio {
font-family: 'Inter', sans-serif;
font-size: 13px;
line-height: 1.55;
color: var(--d2-anthracite);
margin: 0;
}
.cm-sidebar-author-bio a { color: var(--d2-navy); }
.cm-sidebar-related {
background: white;
border: 1px solid rgba(11,59,90,.10);
padding: 22px 22px 18px;
border-radius: 4px;
}
.cm-sidebar-related-title {
display: block;
font-family: 'Inter', sans-serif;
font-size: 11px;
font-weight: 600;
color: var(--d2-gold);
text-transform: uppercase;
letter-spacing: 1.5px;
margin-bottom: 12px;
}
.cm-sidebar-related ul {
list-style: none;
padding: 0;
margin: 0;
}
.cm-sidebar-related li {
padding: 8px 0;
border-bottom: 1px dotted rgba(11,59,90,.12);
}
.cm-sidebar-related li:last-child { border-bottom: none; }
.cm-sidebar-related a {
display: block;
font-family: 'Inter', sans-serif;
font-size: 13px;
line-height: 1.4;
color: var(--d2-navy);
text-decoration: none;
font-weight: 500;
}
.cm-sidebar-related a:hover { color: var(--d2-gold); }
@media (max-width: 1024px) {
.cm-article-layout { grid-template-columns: 1fr; gap: 32px; }
.cm-article-sidebar { position: static; flex-direction: row; flex-wrap: wrap; }
.cm-article-sidebar > * { flex: 1 1 280px; }
}
@media (max-width: 700px) {
.cm-article-header { grid-template-columns: 1fr; gap: 20px; }
.cm-article-featured { order: -1; }
.cm-article-featured img { height: 220px; }
.cm-article-sidebar { flex-direction: column; }
}
.cm-article {
max-width: none;
margin: 0;
}
.cm-article-eyebrow {
display: block;
font-family: 'Inter', sans-serif;
font-size: 11px;
font-weight: 700;
color: var(--d2-gold);
text-transform: uppercase;
letter-spacing: 1.6px;
margin-bottom: 12px;
}
.cm-article-eyebrow a { color: inherit; text-decoration: none; }
.cm-article-title {
font-family: 'Cormorant Garamond', serif;
font-size: 38px;
font-weight: 600;
color: var(--d2-navy);
line-height: 1.15;
margin: 0 0 16px;
letter-spacing: -0.5px;
}
.cm-article-meta {
font-family: 'Inter', sans-serif;
font-size: 13px;
color: var(--d2-sage);
margin: 0 0 32px;
padding-bottom: 18px;
border-bottom: 1px solid rgba(11,59,90,.10);
}
.cm-article-meta a { color: var(--d2-navy); text-decoration: none; border-bottom: 1px solid rgba(11,59,90,.20); }
.cm-article-meta a:hover { color: var(--d2-gold); border-bottom-color: var(--d2-gold); }
.cm-article-content { font-size: 16.5px; line-height: 1.75; color: var(--d2-anthracite); }
.cm-article-content h2 {
font-family: 'Cormorant Garamond', serif;
font-size: 28px;
font-weight: 600;
color: var(--d2-navy);
margin: 40px 0 14px;
line-height: 1.2;
letter-spacing: -0.2px;
}
.cm-article-content h3 {
font-family: 'Cormorant Garamond', serif;
font-size: 22px;
font-weight: 600;
color: var(--d2-navy);
margin: 28px 0 10px;
line-height: 1.3;
}
.cm-article-content p { margin: 0 0 1.3em; }
.cm-article-content a { color: var(--d2-navy); border-bottom: 1px solid rgba(11,59,90,.30); text-decoration: none; transition: color .2s, border-color .2s; }
.cm-article-content a:hover { color: var(--d2-gold); border-bottom-color: var(--d2-gold); }
.cm-article-content blockquote {
margin: 28px 0;
padding: 20px 28px;
border-left: 3px solid var(--d2-gold);
background: var(--d2-cream);
font-family: 'Cormorant Garamond', serif;
font-style: italic;
font-size: 19px;
color: var(--d2-navy);
border-radius: 0 4px 4px 0;
}
.cm-article-content ul, .cm-article-content ol { margin: 0 0 1.3em 1.2em; padding-left: 1em; }
.cm-article-content li { margin-bottom: 6px; }
.cm-article-bottom {
max-width: 760px;
margin: 56px auto 24px;
padding-top: 32px;
border-top: 1px solid rgba(11,59,90,.10);
}
@media (max-width: 700px) {
.cm-blog-grid { grid-template-columns: 1fr; }
.cm-article-title { font-size: 30px; }
.cm-article-content { font-size: 16px; }
.cm-article-content h2 { font-size: 24px; }
}
/* ---------- HERO PROMESSES (page honoraires : 3 garanties side panel) ---------- */
.cm-promises {
margin: 0;
padding: 28px 28px 24px;
background: var(--d2-cream);
border: 1px solid rgba(184,137,62,.20);
border-radius: 4px;
position: relative;
}
.cm-promises::before {
content: "";
position: absolute;
top: 0; left: 0;
width: 4px;
height: 60px;
background: var(--d2-gold);
}
.cm-promises-eyebrow {
display: block;
font-family: 'Inter', sans-serif;
font-size: 11px;
font-weight: 600;
color: var(--d2-gold);
text-transform: uppercase;
letter-spacing: 1.6px;
margin-bottom: 14px;
}
.cm-promise {
display: flex;
gap: 14px;
align-items: flex-start;
padding: 12px 0;
border-bottom: 1px solid rgba(11,59,90,.08);
}
.cm-promise:last-child { border-bottom: none; padding-bottom: 4px; }
.cm-promise:first-of-type { padding-top: 4px; }
.cm-promise-icon {
flex-shrink: 0;
width: 28px; height: 28px;
color: var(--d2-navy);
}
.cm-promise-icon svg { width: 100%; height: 100%; }
.cm-promise-text {
font-family: 'Inter', sans-serif;
font-size: 13px;
line-height: 1.5;
color: var(--d2-anthracite);
margin: 0;
}
.cm-promise-text strong {
display: block;
font-family: 'Cormorant Garamond', serif;
font-size: 16px;
font-weight: 600;
color: var(--d2-navy);
margin-bottom: 2px;
}
/* Adjust hero for honoraires : right column = promises, not portrait */
.cm-hero.cm-hero-promises {
grid-template-columns: 1.4fr 1fr;
}
.cm-hero.cm-hero-promises .cm-promises { align-self: start; }
/* ---------- PRICING CARDS (3 modes de facturation) ---------- */
.cm-pricing-cards {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 22px;
margin: 32px 0 56px;
}
.cm-pricing {
background: white;
border: 1px solid rgba(11,59,90,.12);
border-radius: 4px;
padding: 0;
display: flex;
flex-direction: column;
overflow: hidden;
transition: border-color .25s, box-shadow .25s, transform .25s;
}
.cm-pricing:hover {
border-color: var(--d2-gold);
box-shadow: 0 14px 30px rgba(11,59,90,.10);
transform: translateY(-2px);
}
.cm-pricing-header {
background: var(--d2-cream);
padding: 26px 24px 20px;
border-bottom: 1px solid rgba(184,137,62,.18);
position: relative;
}
.cm-pricing-icon {
width: 38px; height: 38px;
color: var(--d2-gold);
margin-bottom: 14px;
}
.cm-pricing-icon svg { width: 100%; height: 100%; }
.cm-pricing-title {
font-family: 'Cormorant Garamond', serif;
font-size: 22px;
font-weight: 600;
color: var(--d2-navy);
margin: 0 0 4px;
line-height: 1.2;
}
.cm-pricing-ribbon {
font-family: 'Inter', sans-serif;
font-size: 11px;
font-weight: 600;
color: var(--d2-gold);
text-transform: uppercase;
letter-spacing: 1.4px;
}
.cm-pricing-body {
padding: 22px 24px 26px;
flex: 1;
display: flex;
flex-direction: column;
}
.cm-pricing-desc {
font-family: 'Inter', sans-serif;
font-size: 14px;
line-height: 1.6;
color: var(--d2-anthracite);
margin: 0 0 18px;
}
.cm-pricing-bullets {
list-style: none;
padding: 0;
margin: 0 0 18px;
}
.cm-pricing-bullets li {
position: relative;
padding: 6px 0 6px 22px;
font-family: 'Inter', sans-serif;
font-size: 13px;
line-height: 1.5;
color: var(--d2-anthracite);
}
.cm-pricing-bullets li::before {
content: "";
position: absolute;
left: 0;
top: 12px;
width: 12px; height: 2px;
background: var(--d2-gold);
}
.cm-pricing-footer {
margin-top: auto;
padding-top: 14px;
border-top: 1px dashed rgba(11,59,90,.15);
font-family: 'Inter', sans-serif;
font-size: 12px;
font-style: italic;
color: var(--d2-sage);
line-height: 1.5;
}
/* ---------- INFO BOX (didactique convention d'honoraires) ---------- */
.cm-info-box {
margin: 48px 0;
padding: 32px 36px;
background: var(--d2-cream);
border-left: 4px solid var(--d2-gold);
border-radius: 0 4px 4px 0;
position: relative;
}
.cm-info-box-eyebrow {
display: block;
font-family: 'Inter', sans-serif;
font-size: 11px;
font-weight: 600;
color: var(--d2-gold);
text-transform: uppercase;
letter-spacing: 1.6px;
margin-bottom: 8px;
}
.cm-info-box-title {
font-family: 'Cormorant Garamond', serif;
font-size: 24px;
font-weight: 600;
color: var(--d2-navy);
margin: 0 0 14px;
line-height: 1.2;
}
.cm-info-box-text {
font-family: 'Inter', sans-serif;
font-size: 15px;
line-height: 1.65;
color: var(--d2-anthracite);
margin: 0 0 18px;
}
.cm-info-box-list {
list-style: none;
padding: 0;
margin: 0;
display: grid;
grid-template-columns: 1fr 1fr;
gap: 12px 28px;
}
.cm-info-box-list li {
position: relative;
padding-left: 22px;
font-family: 'Inter', sans-serif;
font-size: 14px;
line-height: 1.5;
color: var(--d2-navy);
font-weight: 500;
}
.cm-info-box-list li::before {
content: "✓";
position: absolute;
left: 0; top: 0;
color: var(--d2-gold);
font-weight: 700;
font-size: 14px;
}
/* ---------- PROCESS STEPS (4 etapes horizontales numerotees) ---------- */
.cm-process {
display: grid;
grid-template-columns: repeat(4, 1fr);
gap: 0;
margin: 32px 0 56px;
position: relative;
}
.cm-step {
position: relative;
padding: 0 18px;
text-align: left;
}
.cm-step:not(:last-child)::after {
content: "";
position: absolute;
top: 22px;
right: -8px;
width: 16px;
height: 2px;
background: var(--d2-gold);
opacity: 0.4;
}
.cm-step-num {
display: inline-flex;
align-items: center;
justify-content: center;
width: 56px;
height: 56px;
border-radius: 50%;
background: var(--d2-cream);
border: 2px solid var(--d2-gold);
color: var(--d2-navy);
font-family: 'Cormorant Garamond', serif;
font-size: 26px;
font-weight: 700;
margin-bottom: 16px;
}
.cm-step-title {
font-family: 'Cormorant Garamond', serif;
font-size: 17px;
font-weight: 600;
color: var(--d2-navy);
margin: 0 0 6px;
line-height: 1.25;
}
.cm-step-desc {
font-family: 'Inter', sans-serif;
font-size: 13px;
line-height: 1.55;
color: var(--d2-anthracite);
margin: 0;
}
@media (max-width: 900px) {
.cm-pricing-cards { grid-template-columns: 1fr; }
.cm-process { grid-template-columns: 1fr; gap: 24px; }
.cm-step:not(:last-child)::after { display: none; }
.cm-step { padding: 0; display: grid; grid-template-columns: 60px 1fr; gap: 16px; align-items: start; }
.cm-step-num { margin-bottom: 0; }
.cm-info-box-list { grid-template-columns: 1fr; }
.cm-info-box { padding: 24px 22px; }
.cm-hero.cm-hero-promises { grid-template-columns: 1fr; }
}
/* ---------- TIMELINE PARCOURS (verticale, ligne or + pastilles) ---------- */
.cm-timeline {
position: relative;
margin: 48px 0 56px;
padding: 8px 0 8px 36px;
}
.cm-timeline::before {
content: "";
position: absolute;
top: 8px; bottom: 8px; left: 10px;
width: 2px;
background: linear-gradient(to bottom, var(--d2-gold) 0%, rgba(184,137,62,.15) 100%);
}
.cm-tl-item {
position: relative;
padding: 0 0 28px 18px;
}
.cm-tl-item:last-child { padding-bottom: 0; }
.cm-tl-item::before {
content: "";
position: absolute;
left: -32px; top: 6px;
width: 12px; height: 12px;
border-radius: 50%;
background: var(--d2-cream);
border: 2px solid var(--d2-gold);
box-shadow: 0 0 0 4px var(--d2-cream);
}
.cm-tl-item.is-highlight::before {
background: var(--d2-gold);
}
.cm-tl-date {
display: inline-block;
font-family: 'Inter', sans-serif;
font-size: 11px;
font-weight: 600;
color: var(--d2-gold);
text-transform: uppercase;
letter-spacing: 1.4px;
margin-bottom: 6px;
}
.cm-tl-title {
font-family: 'Cormorant Garamond', serif;
font-size: 19px;
font-weight: 600;
color: var(--d2-navy);
margin: 0 0 4px;
line-height: 1.25;
}
.cm-tl-org {
font-family: 'Inter', sans-serif;
font-size: 13px;
color: var(--d2-anthracite);
font-style: italic;
margin: 0 0 6px;
}
.cm-tl-desc {
font-family: 'Inter', sans-serif;
font-size: 13px;
color: var(--d2-anthracite);
line-height: 1.55;
margin: 0;
opacity: 0.85;
}
@media (max-width: 600px) {
.cm-timeline { padding-left: 26px; }
.cm-tl-item { padding-left: 14px; }
.cm-tl-item::before { left: -24px; width: 10px; height: 10px; }
}
/* ---------- FAQ (inspire preprod Twaino agence-seo, charte navy/or) ---------- */
.cm-faq {
margin: 64px 0 24px;
padding: 36px 0 8px;
border-top: 1px solid rgba(11,59,90,.10);
}
.cm-faq-eyebrow {
display: block;
font-family: 'Inter', sans-serif;
font-size: 11px;
font-weight: 600;
color: var(--d2-gold);
text-transform: uppercase;
letter-spacing: 1.8px;
margin-bottom: 8px;
}
.cm-faq-title {
font-family: 'Cormorant Garamond', serif;
font-size: 28px;
font-weight: 600;
color: var(--d2-navy);
margin: 0 0 28px;
letter-spacing: -0.3px;
}
.cm-faq-layout {
display: block;
}
.cm-faq-nav {
display: flex;
flex-direction: row;
flex-wrap: wrap;
gap: 8px;
margin-bottom: 24px;
padding-bottom: 18px;
border-bottom: 1px solid rgba(11,59,90,.10);
}
button.cm-faq-nav-item,
.cm-faq-nav-item {
display: inline-flex !important;
align-items: center !important;
gap: 8px !important;
padding: 10px 18px !important;
border-radius: 24px !important;
cursor: pointer !important;
background: rgba(11,59,90,.04) !important;
border: 1px solid transparent !important;
text-align: left !important;
font-family: 'Inter', sans-serif !important;
font-size: 13px !important;
font-weight: 500 !important;
color: var(--d2-anthracite) !important;
letter-spacing: 0.2px !important;
text-transform: none !important;
line-height: 1.2 !important;
min-height: 0 !important;
transition: background .2s, color .2s, border-color .2s;
width: auto !important;
box-shadow: none !important;
white-space: nowrap;
}
button.cm-faq-nav-item:hover,
.cm-faq-nav-item:hover {
background: rgba(184,137,62,.10) !important;
color: var(--d2-navy) !important;
border-color: rgba(184,137,62,.30) !important;
}
button.cm-faq-nav-item.is-active,
.cm-faq-nav-item.is-active {
background: var(--d2-navy) !important;
color: var(--d2-cream) !important;
font-weight: 600 !important;
border-color: var(--d2-navy) !important;
}
.cm-faq-nav-item .nav-dot {
width: 6px; height: 6px; border-radius: 50%;
background: rgba(11,59,90,.25);
flex-shrink: 0;
transition: background .2s;
}
.cm-faq-nav-item.is-active .nav-dot { background: var(--d2-gold); }
.cm-faq-nav-item:hover .nav-dot { background: var(--d2-gold); }
.cm-faq-content { display: block; min-width: 0; }
.cm-faq-group {
display: none;
animation: cmFaqFade .25s ease;
}
.cm-faq-group.is-active { display: block; }
@keyframes cmFaqFade {
from { opacity: 0; transform: translateY(4px); }
to { opacity: 1; transform: none; }
}
.cm-faq-group-title {
display: none;
}
.cm-faq-item {
border: 1px solid rgba(11,59,90,.10);
border-radius: 4px;
margin-bottom: 8px;
overflow: hidden;
background: white;
transition: border-color .25s, box-shadow .25s;
}
.cm-faq-item:hover { border-color: rgba(184,137,62,.40); }
.cm-faq-item.is-open {
border-color: var(--d2-gold);
box-shadow: 0 4px 14px rgba(11,59,90,.06);
}
.cm-faq-question {
display: flex !important;
justify-content: space-between !important;
align-items: center !important;
gap: 10px;
padding: 14px 18px !important;
cursor: pointer;
font-family: 'Inter', sans-serif;
font-size: 14px !important;
font-weight: 600;
color: var(--d2-navy) !important;
background: none !important;
border: none !important;
width: 100%;
text-align: left;
line-height: 1.4;
text-transform: none !important;
letter-spacing: 0;
min-height: 0 !important;
}
.cm-faq-question:hover { color: var(--d2-gold) !important; }
.cm-faq-question .faq-chevron {
flex-shrink: 0;
width: 14px;
height: 14px;
transition: transform .3s;
color: var(--d2-gold);
display: inline-block;
}
.cm-faq-item.is-open .faq-chevron { transform: rotate(180deg); }
.cm-faq-answer {
max-height: 0;
overflow: hidden;
transition: max-height .4s ease, padding .4s ease;
padding: 0 18px;
}
.cm-faq-item.is-open .cm-faq-answer {
max-height: 1000px;
padding: 4px 18px 16px;
}
.cm-faq-answer p {
margin: 0 0 10px;
font-family: 'Inter', sans-serif;
font-size: 14px;
color: var(--d2-anthracite);
line-height: 1.7;
}
.cm-faq-answer p:last-child { margin-bottom: 0; }
.cm-faq-answer a {
color: var(--d2-navy);
text-decoration: none;
border-bottom: 1px solid rgba(11,59,90,.25);
transition: color .2s, border-color .2s;
}
.cm-faq-answer a:hover { color: var(--d2-gold); border-bottom-color: var(--d2-gold); }
@media (max-width: 700px) {
.cm-faq-nav {
overflow-x: auto;
flex-wrap: nowrap;
-webkit-overflow-scrolling: touch;
margin-left: -6px;
margin-right: -6px;
padding-left: 6px;
padding-right: 6px;
}
.cm-faq-nav-item { font-size: 12px !important; padding: 9px 14px !important; }
}
@media (max-width: 600px) {
.cm-faq-title { font-size: 24px; }
.cm-faq-question { font-size: 13px !important; padding: 12px 14px !important; }
}
/* ---------- INTERNAL LINK FOOTER (related) ---------- */
.cm-related {
margin: 48px 0;
padding: 24px 28px;
background: rgba(184,137,62,.06);
border-left: 3px solid var(--d2-gold);
border-radius: 0 4px 4px 0;
}
.cm-related-label {
display: block;
font-family: 'Inter', sans-serif;
font-size: 11px;
font-weight: 600;
color: var(--d2-gold);
text-transform: uppercase;
letter-spacing: 1.5px;
margin-bottom: 10px;
}
.cm-related-links {
font-family: 'Inter', sans-serif;
font-size: 14px;
color: var(--d2-anthracite);
line-height: 1.7;
margin: 0;
}
.cm-related-links a {
color: var(--d2-navy);
text-decoration: none;
border-bottom: 1px solid rgba(11,59,90,.25);
transition: color .2s, border-color .2s;
}
.cm-related-links a:hover {
color: var(--d2-gold);
border-bottom-color: var(--d2-gold);
}
/* ---------- RESPONSIVE ---------- */
@media (max-width: 900px) {
.cm-cards { grid-template-columns: repeat(2, 1fr); }
.cm-split { grid-template-columns: 1fr; gap: 32px; }
.cm-stats { grid-template-columns: 1fr; }
.cm-stat { border-right: none; border-bottom: 1px solid rgba(184,137,62,.18); }
.cm-stat:last-child { border-bottom: none; }
.cm-stat-number { font-size: 44px; }
}
@media (max-width: 600px) {
.cm-cards { grid-template-columns: 1fr; }
.cm-cta { padding: 40px 28px; }
.cm-cta-title { font-size: 28px; }
.cm-mandate { flex-direction: column; gap: 6px; align-items: flex-start; padding: 18px 0; }
.cm-hero-image { margin: 24px 0 40px; }
}
/* === Bandeau cabinet : deux noms (05/06/2026) === */
.main-title .cm-title-sep{ color:#B8893E; font-weight:400; margin:0 .18em; }
.main-title{ font-size:34px; white-space:nowrap; letter-spacing:.4px; }
@media (max-width: 768px){
.main-title{ font-size:24px; line-height:1.25; }
}
/* lien muet (placeholder profil) */
.cm-card-link-muted{ color:#9a9a9a; cursor:default; }
.cm-card-link-muted:hover{ color:#9a9a9a; }
/* ====== Retours client 27/06 (Juris Terra) ====== */
/* G2 — Justification bord à bord du corps de texte */
.cm-hero-banner-lead,
.cm-hero-lead,
.cm-intro-below,
.cm-split-text p,
.cm-faq-answer p,
.cm-info-box-text,
.cm-cta-text,
.cm-bigcard-desc,
.cm-tl-desc {
text-align: justify;
text-justify: inter-word;
-webkit-hyphens: auto;
hyphens: auto;
}
/* A5 — Liste des domaines (accueil), aérée */
.cm-domain-list {
list-style: none;
margin: 0 0 1.6rem;
padding: 0;
display: grid;
gap: .45rem;
}
.cm-domain-list li {
position: relative;
padding-left: 1.5rem;
font-weight: 600;
color: var(--d2-navy);
}
.cm-domain-list li::before {
content: "\203A";
position: absolute;
left: .2rem;
color: #B8893E;
font-weight: 700;
}
/* ====== Retours client 27/06 — Wave 2 (visuels + centrage) ====== */
/* Photos rondes dans les cartes avocats associés */
.cm-card-photo { margin: 0 auto 1.1rem; width: 132px; height: 132px; }
.cm-card-photo img { width: 132px; height: 132px; border-radius: 50%; object-fit: cover; object-position: center 22%; border: 3px solid #B8893E; display: block; }
.cm-cards-duo .cm-card { text-align: center; }
.cm-cards-duo .cm-card .cm-card-desc { text-align: center; }
.cm-cards-duo .cm-card .cm-card-link { display: inline-block; }
/* G4 — centrage des titres de sections / bandeaux (harmonie, toutes pages) */
.entry-content > h2,
.cm-cta-title,
.cm-faq-title { text-align: center; }
.cm-faq-eyebrow { display: block; text-align: center; }
/* ====== Retours Alexandre 27/06 — Wave 3 : pleine largeur + justification ====== */
/* Les blocs texte ne doivent plus etre brides a gauche : ils prennent toute la largeur utile, justifies */
.cm-intro-below { max-width: 100%; }
.cm-hero-lead { max-width: 100%; }
.cm-hero-banner-inner h1,
.cm-hero-banner-lead { max-width: 100%; }
.cm-hero-banner-inner { max-width: 1200px; }
.cm-cta-text { max-width: 100%; }
/* ====== Retours Alexandre 27/06 — Wave 4 : boutons CTA centrés + icônes alignées ====== */
.cm-cta-actions { justify-content: center; }
.cm-cta-btn svg, .cm-hero-btn svg { position: relative; top: 0; }
/* ====== Photos réelles client 02/07 — Wave 5 ====== */
.cm-team-photo { margin: 0 auto 2.4rem; max-width: 100%; }
.cm-team-photo img { width: 100%; height: auto; display: block; border-radius: 4px; }
/* ====== Wave 6 : corrections mobile (retours Camille 01/07) ====== */
@media (max-width: 768px) {
/* Étapes numérotées : description en pleine largeur (fin du 1 mot par ligne) */
.cm-step { grid-template-columns: 48px 1fr; }
.cm-step-desc { grid-column: 1 / -1; }
/* Boutons CTA : uniformes, pleine largeur, empilés et centrés */
.cm-cta-actions { flex-direction: column; align-items: stretch; }
.cm-cta-btn { width: 100%; }
}
/* Page Cabinet (2768) — hero full-bleed comme l'accueil */
.page-id-2768 .entry-header { display: none !important; }
.page-id-2768 .site-content,
.page-id-2768 .inside-article { padding-top: 0; }
.page-id-2768 .entry-content { margin-top: 0; }