/* Publicité & Partenariats (maquette 18). Les composants communs (en-tête, titres, panneaux, cartes,
   formulaires, coordonnées) sont dans pages/contact.css, chargé aussi par le gabarit. Cotes : maquette × 1,477. */

:root {
	--pub-i-check: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E");
}

/* ---------- En-tête : texte à gauche, atouts à droite ---------- */
.cp-hero--pub .cp-hero__inner { min-height: 343px; padding-block: 14px 20px; }
.cp-hero--pub .breadcrumb { margin-bottom: 18px; }
.cp-hero--pub .page-intro { display: grid; grid-template-columns: minmax(0, 560px) 1fr; align-items: start; max-width: none; }
.cp-hero--pub .page-intro :is(p, h1, .wp-block-buttons) { grid-column: 1; }
.cp-hero--pub .cp-hero__badge { justify-self: start; }
.cp-hero--pub .cp-hero__title { margin-top: 10px; font-size: 47px; line-height: 1.04; letter-spacing: 0; }
.cp-hero--pub .cp-hero__title::after { display: none; }
.cp-hero--pub .page-intro p:not(.cp-hero__badge, .cp-hero__lead) { max-width: 510px; margin-top: 12px; font-size: 20px; line-height: 1.4; }
.cp-hero--pub .page-intro .cp-hero__cta { margin-top: 19px; }
.cp-hero__cta .wp-block-button__link { display: inline-flex; align-items: center; gap: 12px; min-height: 44px; padding: 0 24px; border: 1.5px solid var(--white); border-radius: 4px; background: var(--red); color: var(--white); font-size: 16px; font-weight: 600; text-decoration: none; }
/* Photo quelconque à droite : voile léger sous les atouts pour garder le texte blanc lisible (mobile : voile de contact.css). */
@media (min-width: 601px) {
	.cp-hero--pub .page-hero__media::after { background: linear-gradient(270deg, rgb(0 0 0 / .5) 0%, rgb(0 0 0 / .32) 24%, rgb(0 0 0 / 0) 40%), linear-gradient(90deg, rgb(8 0 0 / .96) 0%, rgb(40 2 4 / .86) 30%, rgb(60 4 8 / .35) 52%, rgb(0 0 0 / 0) 72%); }
}
.cp-hero__cta .wp-block-button__link::after { content: ""; width: 16px; height: 16px; background: currentColor; -webkit-mask: var(--cp-i-arrow) center / contain no-repeat; mask: var(--cp-i-arrow) center / contain no-repeat; }
.cp-hero__cta .wp-block-button__link:hover, .cp-hero__cta .wp-block-button__link:focus-visible { background: var(--red-dark); color: var(--white); }
.cp-hero--pub .pub-atouts { grid-column: 2; grid-row: 1 / span 4; align-self: end; justify-self: end; display: grid; gap: 7px; margin: 0 36px -13px 0; }
.pub-atouts li { display: flex; align-items: center; gap: 12px; color: var(--white); font-size: 18px; font-weight: 700; text-shadow: 0 1px 4px rgb(0 0 0 / .75); }
.pub-atouts .cp-ico { display: grid; place-items: center; width: 34px; height: 34px; border-radius: 50%; background: var(--red); color: var(--white); font-size: 19px; }
.pub-atouts .cp-solid { --cp-hole: var(--red); }

/* ---------- Titres de section (plus petits que sur la page Contact) ---------- */
.pub-content h2.wp-block-heading { font-size: 20px; }
/* Largeurs mesurées sur la maquette : ces titres y sont un peu plus petits. */
.cp-content :is(.pub-platforms, .pub-why) h2.wp-block-heading { font-size: 18.5px; }
.cp-content .pub-process h2.wp-block-heading { font-size: 19.5px; }
.pub-content h2.wp-block-heading + p { margin-top: 2px; }

/* ---------- Notre audience ---------- */
.pub-stats { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 13px; margin-top: 10px; }
.cp-content .pub-stat { display: grid; grid-template-columns: auto 1fr; align-items: center; column-gap: 26px; padding: 20px 6px 20px 25px; border: 1px solid #f4e4e5; border-radius: var(--radius); background: #fef8f8; font-size: 13px; line-height: 1.35; color: #555; }
.pub-stat .cp-ico { grid-row: span 2; font-size: 36px; }
.pub-stat .cp-solid { --cp-hole: #fef8f8; }
.pub-stat strong { margin-bottom: -3px; font-size: 20px; font-weight: 800; color: var(--ink); line-height: 1.1; }

/* ---------- Nos solutions publicitaires ---------- */
.pub-solutions .cp-cards { margin-top: 10px; }
.pub-solution { padding: 10px 8px 13px; }
.cp-content .pub-solution h3.wp-block-heading { display: flex; align-items: center; gap: 20px; padding-inline: 6px; font-size: 17px; letter-spacing: -.01em; }
.pub-solution h3 .cp-ico { font-size: 40px; }
/* 13,5 px : « Partenariats de contenu » tient en 5 lignes comme la maquette (elle y réduit le texte). */
.cp-content .pub-solution h3.wp-block-heading + p { margin: 6px 0 7px 66px; font-size: 13.5px; line-height: 1.38; color: #555; }
.pub-solution__media { display: flex; align-items: center; justify-content: center; margin-top: auto; aspect-ratio: 2 / 1; border-radius: 4px; overflow: hidden; background: linear-gradient(135deg, #1b1b1d, #2b2b2f); font: 900 28px/1 var(--font); letter-spacing: -.03em; color: rgb(255 255 255 / .9); }
.pub-solution__media:not(:has(img))::before { content: "LECRI"; }
.pub-solution__media:not(:has(img))::after { content: "24"; color: var(--red); }
.pub-solution__media figure { width: 100%; height: 100%; margin: 0 !important; }
.pub-solution__media img { width: 100%; height: 100%; object-fit: cover; }
.pub-solution .wp-block-buttons { margin-top: 0; padding-top: 12px; }
.cp-content .pub-solution .wp-block-button__link { min-height: 35px; }

/* ---------- Formats, plateformes, pourquoi nous ---------- */
.pub-offer { display: grid; grid-template-columns: minmax(0, 310fr) minmax(0, 281fr) minmax(0, 227fr); gap: 32px; align-items: start; }
/* Schéma des emplacements (cotes de la maquette × 1,477) : bandeau d'en-tête gris clair, puis article + bannières à gauche, colonne latérale à 26,5 %. */
.pub-schema { display: grid; gap: 14px; margin-top: 12px; padding: 2px 0 8px; border: 1px solid #e3e3e3; border-radius: var(--radius); overflow: hidden; background: var(--white); box-shadow: 0 2px 8px rgb(0 0 0 / .05); }
.pub-schema__top { display: flex; align-items: center; gap: 10px; padding: 2px 24px 1px; background: #f4f4f4; }
.pub-schema__logo { display: block; flex: none; font: 900 24px/1 var(--font); letter-spacing: -.04em; color: var(--ink); }
.pub-schema__logo b { color: var(--red); }
.pub-schema__logo::after { content: ""; display: block; height: 2px; margin: 2px 2px 0; background: #8a8a8a; } /* la devise sous le logo */
.pub-schema__ad { display: grid; place-items: center; padding: 4px 8px; border-radius: 3px; background: #f5070e; color: var(--white); font-size: 13.5px; font-weight: 700; line-height: 1.15; text-align: center; }
.pub-schema__top .pub-schema__ad { flex: 1; min-height: 34px; }
.pub-schema i { display: block; border-radius: 2px; background: #d3d4d7; }
.pub-schema__mid { display: grid; grid-template-columns: minmax(0, 1fr) 26.5%; gap: 9px; align-items: start; padding-inline: 24px; }
.pub-schema__main { display: grid; gap: 7px; }
.pub-schema__main > i { width: 96%; height: 7px; }
.pub-schema__article { position: relative; height: 88px; border-radius: 3px; background: linear-gradient(90deg, #c8c8ca, #e3e3e4); }
.pub-schema__thumb { position: absolute; left: 16px; top: 18px; width: 28px; height: 32px; border-radius: 3px; background: rgb(255 255 255 / .75); }
.pub-schema__article .pub-schema__ad { width: min(168px, 62%); height: 71px; margin: 10px 0 0 20%; }
.pub-schema__ad--footer { min-height: 34px; }
.pub-schema__side { display: grid; grid-template-rows: 95px 43px; gap: 7px; }
.pub-schema__side i { background: #cecfd1; }

.pub-platforms h2.wp-block-heading + p { font-size: 13.5px; }
.pub-list { margin: 8px 0 0 -2px !important; }
.pub-list li { position: relative; padding: 8px 0 8px 86px; border-bottom: 1px solid #ececec; font-size: 13.4px; line-height: 1.4; color: #555; }
.pub-list li:last-child { border-bottom: 0; }
.pub-list .cp-ico { position: absolute; left: 14px; top: 11px; font-size: 36px; }
.pub-list .cp-solid--social { width: 1.42em; } /* pictogramme large : « f » et bulle */
.pub-list strong { display: block; font-size: 15px; font-weight: 700; color: var(--ink); }

.pub-checks { display: grid; gap: 20px; margin: 20px 0 0 16px !important; }
.pub-checks li { position: relative; padding-left: 41px; font-size: 12.7px; line-height: 1.35; color: #444; }
.pub-checks li::before { content: ""; position: absolute; left: 0; top: -3px; width: 22px; height: 22px; border-radius: 50%; background: var(--red); }
.pub-checks li::after { content: ""; position: absolute; left: 5px; top: 2px; width: 12px; height: 12px; background: var(--white); -webkit-mask: var(--pub-i-check) center / contain no-repeat; mask: var(--pub-i-check) center / contain no-repeat; }

/* « Pourquoi nous choisir ? » déborde légèrement du conteneur sur la maquette : chaque atout tient sur une ligne. */
@media (min-width: 1360px) { /* 36 px de débord, moins que la marge du conteneur à partir de 1360 px */
	.pub-why { margin-right: -36px; }
}

/* ---------- Comment collaborer avec nous ? ---------- */
/* Étapes réparties sur toute la carte (1re et 5e près des bords), flèches au milieu des écarts. */
.pub-steps { --pub-gap: 76px; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); column-gap: var(--pub-gap); margin-top: 5px; padding: 8px 20px 12px; border: 1px solid var(--cp-card-line); border-radius: var(--radius); background: var(--white); counter-reset: pub-step; }
.pub-step { position: relative; text-align: center; counter-increment: pub-step; }
.pub-step::before { content: counter(pub-step); display: grid; place-items: center; width: 33px; height: 33px; margin: 0 auto 6px; border: 2px solid var(--red); border-radius: 50%; color: var(--red); font: 700 20px/1 var(--cp-serif); }
.pub-step:not(:last-child)::after { content: ""; position: absolute; right: calc(var(--pub-gap) / -2 - 8px); top: 44px; width: 16px; height: 16px; background: var(--red); -webkit-mask: var(--cp-i-arrow) center / contain no-repeat; mask: var(--cp-i-arrow) center / contain no-repeat; }
.cp-content .pub-step h3.wp-block-heading { font-size: 14.3px; font-weight: 700; }
.cp-content .pub-step h3 + p { margin-top: 2px; font-size: 13.3px; line-height: 1.4; color: #555; }

/* ---------- Ils nous font confiance, témoignage (blocs masqués tant qu'ils sont vides) ---------- */
.pub-proof { display: flex; gap: 26px; align-items: start; }
.pub-proof:not(:has(.pub-trust, .pub-quote)) { display: none; }
.pub-trust { flex: 68 1 0; min-width: 0; }
.pub-quote { flex: 30 1 0; min-width: 0; }
.cp-content .pub-logos.wp-block-gallery { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 12px; margin-top: 12px; }
.cp-content .pub-logos .wp-block-image { display: grid; place-items: center; width: auto !important; aspect-ratio: 85 / 60; margin: 0; padding: 10px; border: 1px solid #eee; border-radius: 4px; background: var(--white); }
.cp-content .pub-logos .wp-block-image img { width: 100% !important; height: 100% !important; object-fit: contain !important; }
.cp-content .pub-quote h2.wp-block-heading { font: 800 17px/1.3 var(--font); }
.pub-quote .wp-block-quote { margin: 12px 0 0; padding: 0; border: 0; font-size: 13.5px; line-height: 1.45; color: #555; }
.pub-quote .wp-block-quote p::before { content: "« "; }
.pub-quote .wp-block-quote p:last-of-type::after { content: " »"; }
.pub-quote .wp-block-quote cite { display: block; margin-top: 12px; font-size: 12.5px; font-style: normal; color: #777; }
.pub-quote .wp-block-quote cite strong { display: block; color: var(--ink); }

/* ---------- FAQ, media kit, contact commercial ---------- */
.pub-contact { display: grid; grid-template-columns: minmax(0, 296fr) minmax(0, 315fr) minmax(0, 218fr); gap: 25px; align-items: start; }
/* Maquette : titres FAQ et Contact commercial plus bas que le haut du panneau media kit. */
.pub-faq { padding-top: 15px; }
.pub-commercial { padding-top: 19px; }
.cp-content .pub-faq h2.wp-block-heading { font: 800 16px/1.3 var(--font); }
.pub-faq .wp-block-details { margin-top: 12px; border: 1px solid #e3e3e3; border-radius: 4px; background: var(--white); }
.pub-faq h2 + .wp-block-details { margin-top: 14px; }
.pub-faq summary { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 41px; padding: 7px 16px 7px 19px; font-size: 13px; font-weight: 600; letter-spacing: -.01em; color: var(--ink); cursor: pointer; list-style: none; }
.pub-faq summary::-webkit-details-marker { display: none; }
.pub-faq summary::after { content: "+"; flex: none; font-size: 24px; font-weight: 400; line-height: 1; }
.pub-faq details[open] summary::after { content: "\2212"; }
.pub-faq summary:hover { color: var(--red); }
.pub-faq details p { padding: 0 16px 14px 19px; font-size: 13.5px; line-height: 1.5; color: #555; }

.cp-content .pub-mediakit { padding: 6px 14px 9px; border-color: #f4dcdf; background: #f9ecee; box-shadow: none; }
.cp-content .pub-mediakit h2.wp-block-heading { margin-left: -10px; padding-left: 16px; color: var(--red); font: 700 18px/1.3 var(--font); letter-spacing: -.02em; }
.cp-content .pub-mediakit h2.wp-block-heading + p { margin-top: 2px; font-size: 12.5px; }
.pub-mediakit .wpcf7 form > :where(p, div) { margin-bottom: 9px; }
.pub-mediakit .wpcf7 .cf-row { margin: 12px 0 16px; gap: 12px; }
.pub-mediakit .wpcf7 .cf-label { margin-bottom: 1px; font-size: 13.5px; }
.pub-mediakit .wpcf7 input[type="text"], .pub-mediakit .wpcf7 input[type="email"] { min-height: 44px; padding: 9px 14px; font-size: 13.5px; }
.pub-mediakit .wpcf7 select { min-height: 34px; padding: 4px 40px 4px 14px; background-position: right 12px center; font-size: 13.5px; }
.pub-mediakit .wpcf7 .cf-field--user input, .pub-mediakit .wpcf7 .cf-field--mail input { padding-left: 14px; }
.pub-mediakit .wpcf7 .cf-field--user .wpcf7-form-control-wrap::before, .pub-mediakit .wpcf7 .cf-field--mail .wpcf7-form-control-wrap::before { display: none; }
.pub-mediakit .wpcf7 .cf-ph, .pub-mediakit .wpcf7 :is(.cf-field--user, .cf-field--mail) .cf-ph { left: 15px; top: 22px; font-size: 13.5px; }
.pub-mediakit .wpcf7 textarea { height: 52px; min-height: 52px; padding-block: 9px; font-size: 13.5px; }
.pub-mediakit .wpcf7 form > p.cf-consent { margin-bottom: 9px; font-size: 12px; }
.pub-mediakit .wpcf7 .cf-submit .wpcf7-submit { min-height: 35px; font-size: 15px; }
.pub-mediakit .wpcf7 .cf-submit .wpcf7-submit .icon { font-size: 18px; }

.cp-content .pub-commercial h2.wp-block-heading { font-size: 18.3px; }
.cp-content .pub-commercial h2.wp-block-heading + p { font-size: 12.5px; }
.pub-commercial .cp-coords { margin: 12px 0 0 10px !important; }
.pub-commercial .cp-coords__item { padding-bottom: 11px; }
.pub-commercial .cp-socials { margin: 6px 0 0 27px !important; }

/* Bandeau newsletter de la maquette 18 : plus bas et plus petit que celui de la maquette 17. */
@media (min-width: 1025px) {
	.tpl-publicite .nl-banner__inner { grid-template-columns: auto 1fr minmax(320px, 538px); padding: 3px 22px 3px 25px; }
	.tpl-publicite .nl-banner__icon { width: 56px; height: 56px; }
	.tpl-publicite .nl-banner__title { font-size: 18.5px; }
	.tpl-publicite .nl-banner p { font-size: 14.2px; }
	.tpl-publicite .nl-banner .nl-form input, .tpl-publicite .nl-banner .nl-form .btn { min-height: 44px; }
	.tpl-publicite .nl-banner .nl-form .btn { min-width: 164px; }
}

/* ---------- Responsive ---------- */
@media (max-width: 1240px) {
	.pub-stats { grid-template-columns: repeat(3, minmax(0, 1fr)); }
	.pub-steps { --pub-gap: 36px; }
}
@media (max-width: 1024px) {
	.pub-offer, .pub-contact { grid-template-columns: 1fr 1fr; }
	.pub-offer .pub-why, .pub-contact .pub-faq { grid-column: 1 / -1; }
	.pub-faq, .pub-commercial { padding-top: 0; }
	.pub-platforms h2.wp-block-heading + p { font-size: 14.5px; }
}
@media (max-width: 900px) {
	.cp-hero--pub .page-intro { grid-template-columns: 1fr; }
	.cp-hero--pub .pub-atouts { grid-column: 1; grid-row: auto; justify-self: start; display: flex; flex-wrap: wrap; gap: 10px 22px; margin: 22px 0 0; }
	.pub-steps { grid-template-columns: 1fr; gap: 30px; padding: 18px 16px; }
	.pub-step:not(:last-child)::after { right: auto; left: calc(50% - 8px); top: auto; bottom: -24px; transform: rotate(90deg); }
	.cp-content .pub-logos.wp-block-gallery { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 760px) {
	.pub-offer, .pub-contact { grid-template-columns: 1fr; }
	.pub-proof { flex-direction: column; }
}
@media (max-width: 600px) {
	.cp-hero--pub .cp-hero__inner { min-height: 0; padding-block: 18px 28px; }
	.cp-hero--pub .cp-hero__title { font-size: 36px; }
	.cp-hero--pub .page-intro p:not(.cp-hero__badge, .cp-hero__lead) { font-size: 17px; }
	.pub-stats { grid-template-columns: 1fr 1fr; gap: 10px; }
	.cp-content .pub-stat { column-gap: 10px; padding: 14px 12px; font-size: 13px; }
	.pub-stat .cp-ico { font-size: 26px; }
	.pub-stat strong { font-size: 17px; }
	.cp-content .pub-solution h3.wp-block-heading + p { margin-left: 10px; }
	.pub-checks { margin-left: 0 !important; }
	.pub-list { margin-left: 0 !important; }
	.pub-list li { padding-left: 60px; }
	.pub-list .cp-ico { left: 4px; font-size: 32px; }
	.pub-schema__ad { font-size: 12px; }
	.pub-schema__mid, .pub-schema__top { padding-inline: 14px; }
}
@media (max-width: 420px) {
	.pub-stats { grid-template-columns: 1fr; }
}
