/* ============================================================
   cms-content.css — SOURCE UNIQUE du rendu du contenu CMS.

   Utilise a la fois par :
   - l'editeur de page (back office)  -> scope .tiptap
   - le rendu public (front)          -> scope .cms-content

   Toute modif typographique du contenu de page se fait ICI,
   et se reflete des deux cotes. Ne pas dupliquer ailleurs.
   ============================================================ */

.cms-content h2, .tiptap h2,
.cms-content h3, .tiptap h3,
.cms-content h4, .tiptap h4,
.cms-content h5, .tiptap h5,
.cms-content h6, .tiptap h6 {
	color: #222;
	font-weight: 600;
}

.cms-content h2, .tiptap h2 {
	font-size: 26px;
	margin-top: 1.25rem;
	margin-bottom: 0.75rem;
	letter-spacing: -0.01em;
}

.cms-content h3, .tiptap h3 {
	font-size: 22px;
	margin-top: 1rem;
	margin-bottom: 0.6rem;
}

.cms-content h4, .tiptap h4 {
	font-size: 19px;
	margin-top: 1rem;
	margin-bottom: 0.5rem;
}

.cms-content h5, .tiptap h5 {
	font-size: 17px;
	margin-top: 1rem;
	margin-bottom: 0.5rem;
}

.cms-content h6, .tiptap h6 {
	font-size: 15px;
	margin-top: 1rem;
	margin-bottom: 0.5rem;
}

.cms-content p, .tiptap p {
	margin-bottom: 0.7rem;
}

.cms-content ul, .tiptap ul,
.cms-content ol, .tiptap ol {
	padding-left: 1.5rem;
	margin-bottom: 1rem;
}

.cms-content li, .tiptap li {
	margin-bottom: 0.3rem;
}

.cms-content a, .tiptap a {
	color: #2a7ae2;
	text-decoration: underline;
	text-decoration-color: rgba(42, 122, 226, 0.3);
	text-underline-offset: 2px;
	transition: color 0.15s;
}

.cms-content a:hover, .tiptap a:hover {
	color: #1a5bb5;
	text-decoration-color: rgba(42, 122, 226, 0.6);
}

.cms-content blockquote, .tiptap blockquote {
	border: none;
	background: none;
	max-width: 680px;
	margin: 2.5rem auto;
	padding: 0 1rem;
	text-align: center;
	color: #333;
	font-style: italic;
	font-size: 23px;
	line-height: 1.5;
}
.cms-content blockquote::before, .tiptap blockquote::before {
	content: "\201C";
	display: block;
	font-family: Georgia, 'Times New Roman', serif;
	font-size: 54px;
	line-height: 0;
	margin: 1.4rem 0 1.2rem;
	color: #F78E1E;
}
.cms-content blockquote p, .tiptap blockquote p {
	margin-bottom: 0.4rem;
	font-weight: 400;
}
.cms-content blockquote .blockquote-footer, .tiptap blockquote .blockquote-footer {
	display: block;
	margin-top: 1rem;
	font-size: 12px;
	font-style: normal;
	font-weight: 600;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: #F78E1E;
}
.cms-content blockquote .blockquote-footer::before,
.tiptap blockquote .blockquote-footer::before {
	content: "";
}

.cms-content hr, .tiptap hr {
	border: none;
	border-top: 2px solid #e9ecef;
	margin: 2rem 0;
}

.cms-content img, .tiptap img {
	max-width: 100%;
	height: auto;
	border-radius: 4px;
}

.cms-content table, .tiptap table {
	border-collapse: collapse;
	width: 100%;
	margin: 1rem 0;
	border-radius: 6px;
	overflow: hidden;
}

.cms-content table td, .tiptap table td,
.cms-content table th, .tiptap table th {
	border: 1px solid #e2e5e9;
	padding: 10px 14px;
	min-width: 80px;
	vertical-align: top;
}

.cms-content table th, .tiptap table th {
	background: #f4f6f8;
	font-weight: 600;
	font-size: 13px;
	text-transform: uppercase;
	letter-spacing: 0.03em;
	color: #495057;
}

/* ============================================================
   Blocs riches campagne : bandeau, duo texte/photo, mosaique
   Scopes .cms-content (front) ET .tiptap-block-preview (editeur).
   ============================================================ */

/* Placeholder photo (doux, non agressif) */
.cms-ph {
	display:flex; align-items:center; justify-content:center;
	width:100%; background:#f3efe7;
	border:1px dashed #d8ccb4; border-radius:8px;
	color:#b09a72; font-size:14px; font-weight:500; text-align:center;
}
.cms-ph i { margin-right:6px; }

/* --- Bandeau pleine largeur --- */
.cms-banner {
	position:relative;
	/* full-bleed : depasse le conteneur centre */
	margin-left:calc(50% - 50vw); margin-right:calc(50% - 50vw);
	min-height:460px;
	background-size:cover; background-position:center;
	display:flex; align-items:center; justify-content:center;
	overflow:hidden;
}
.cms-banner.is-ph {
	min-height:360px;
	background:linear-gradient(120deg,#F1EBDD,#DBC7A2 45%,#C3D7E1 80%,#AEC1A5);
}
.cms-banner-phlabel {
	position:absolute; bottom:14px; right:18px;
	background:rgba(255,255,255,.75); color:#8a7a5a;
	font-size:12px; padding:3px 10px; border-radius:20px;
}
.cms-banner-overlay {
	position:relative; z-index:2; width:100%;
	padding:48px 24px; text-align:center;
	background:linear-gradient(180deg, rgba(0,0,0,.12), rgba(0,0,0,.32));
}
.cms-banner.is-ph .cms-banner-overlay { background:none; }
.cms-banner-inner { max-width:720px; margin:0 auto; }
.cms-banner-title {
	font-family:'Arsenal', 'Poppins', sans-serif;
	color:#fff; font-size:44px; line-height:1.1; font-weight:700;
	text-shadow:0 2px 14px rgba(0,0,0,.25);
}
.cms-banner.is-ph .cms-banner-title { color:#5a4a33; text-shadow:none; }
.cms-banner-subtitle {
	color:#fff; font-size:20px; margin-top:10px; font-weight:400;
	text-shadow:0 2px 10px rgba(0,0,0,.25);
}
.cms-banner.is-ph .cms-banner-subtitle { color:#6b5a3f; text-shadow:none; }
.cms-banner-btn {
	display:inline-block; margin-top:22px;
	background:#F78E1E; color:#fff !important; text-decoration:none !important;
	padding:11px 30px; border-radius:4px; font-weight:600; font-size:14px;
	letter-spacing:.04em; transition:filter .15s;
}
.cms-banner-btn:hover { filter:brightness(.93); color:#fff; }

/* --- Duo texte + photo --- */
.cms-duo { margin:0; }
.cms-duo-media img { width:100%; border-radius:10px; object-fit:cover; }
.cms-duo-text { padding:24px 32px; }
.cms-duo-btn {
	display:inline-block; margin-top:14px;
	background:#F78E1E; color:#fff !important; text-decoration:none !important;
	padding:10px 26px; border-radius:4px; font-weight:600; font-size:14px;
	letter-spacing:.03em; transition:filter .15s;
}
.cms-duo-btn:hover { filter:brightness(.93); }

/* --- Mosaique --- */
.cms-gallery { display:grid; gap:12px; grid-template-columns:repeat(3,1fr); margin:2rem 0; }
.cms-gallery-2 { grid-template-columns:repeat(2,1fr); }
.cms-gallery-4 { grid-template-columns:repeat(2,1fr); }
.cms-gallery-cell { aspect-ratio:1/1; overflow:hidden; border-radius:8px; }
.cms-gallery-cell img { width:100%; height:100%; object-fit:cover; display:block; transition:transform .4s; }
.cms-gallery-cell img:hover { transform:scale(1.04); }
.cms-gallery .cms-ph { height:100%; border-radius:8px; }

@media (max-width:767px){
	.cms-banner { min-height:300px; }
	.cms-banner-title { font-size:30px; }
	.cms-duo-text { padding:18px 6px; }
	.cms-gallery, .cms-gallery-2, .cms-gallery-4 { grid-template-columns:repeat(2,1fr); }
}