/* =========================================================================
   /publicite — styles propres à la page (mise en page uniquement).
   Aucun coin arrondi, aucune ombre, citron rare, mouvement horizontal (hérité des composants).
   ========================================================================= */

/* Tête de bloc hors .section-head : étiquette, titre, texte */
.pub-head > .label { display: block; }
.pub-head > .h2 { margin-top: 16px; max-width: 13em; }
.pub-text { margin-top: 22px; max-width: 34em; font-size: var(--fs-body); line-height: 1.5; color: var(--graphite); }
.on-encre .pub-text { color: var(--cendre); }
.on-encre .pub-text--strong { color: var(--papier); font-weight: 600; }

/* Blocs texte + image (Être trouvé, Être vu, Concept) */
.pub-split { align-items: center; row-gap: 40px; }
.pub-split__media .frame { max-width: 520px; }
.pub-trouve .pub-split__media .frame,
.pub-concept .pub-split__media .frame { margin-left: auto; }
@media (max-width: 899px) {
  .pub-split__media { order: 2; }
  .pub-split__media .frame,
  .pub-trouve .pub-split__media .frame,
  .pub-concept .pub-split__media .frame { margin-left: 0; max-width: 520px; }
}

/* Être trouvé : 3 éléments sur une colonne (pas de picto orphelin) */
.pub-trouve .features { margin-top: 36px; grid-template-columns: minmax(0, 1fr); }

/* Être vu : ligne Google Ads avec picto citron */
.pub-vu .ruled { margin-top: 32px; }
.pub-ruled-line { display: grid; grid-template-columns: 32px minmax(0, 1fr); gap: 16px; align-items: start; }
.pub-ruled-line > img { width: 32px; height: 32px; }

/* Trois situations : cartes coupées (filet trait continu sur les diagonales) */
.pub-cases { list-style: none; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--g); }
.pub-case {
  --ch: var(--ch-block); --bw: 1px; --line: var(--trait); --fill: var(--blanc);
  display: flex; flex-direction: column; align-items: flex-start; padding: 30px 28px 34px; min-height: 248px;
}
.pub-case__title { margin-top: 24px; font-weight: 800; font-size: var(--fs-h3); line-height: var(--lh-h3); letter-spacing: var(--ls-h3); }
.pub-case__text { margin-top: 10px; max-width: 30em; font-size: var(--fs-small); line-height: 1.5; color: var(--graphite); }
.pub-cases__note { margin-top: 20px; }
@media (max-width: 900px) {
  .pub-cases { grid-template-columns: minmax(0, 1fr); }
  .pub-case { min-height: 0; padding: 24px 22px 26px; }
  .pub-case__title { margin-top: 18px; }
}

/* Processus : impulsions statiques alignées sur le bas du titre */
.pub-process .section-head { align-items: flex-end; }
.pub-process .pulses { padding-bottom: 8px; }

/* Le cadre : liste sur citron 40 (composant .rules), centrée sur le titre */
.pub-cadre .grid-12 { align-items: center; }
.pub-cadre .rules { align-self: center; padding: 32px 32px 34px; }
.pub-cadre .rules__list { margin-top: 0; gap: 18px; }

/* Concept campagne ALBA */
.pub-concept__note { margin-top: 22px; }
.pub-concept__link { margin-top: 24px; }

/* Affiche ALBA posée sur l'affiche vierge de ss2-affiche-rue-jour (SIMULATION, marque fictive).
   Le cadre garde le ratio exact de l'image (4:5) : l'image n'est pas recadrée, les pourcentages
   ci-dessous suivent donc l'affiche à toutes les tailles. Coins mesurés sur l'image 1280 × 1600 :
   HG (213 ; 399) · HD (649 ; 404) · BD (654,5 ; 1013) · BG (215,5 ; 1026).
   multiply : le papier de l'affiche (plis, lumière) reste visible à travers l'impression. */
.pub-affiche__poster {
  position: absolute; z-index: 1;
  left: 16.64%; top: 24.92%; width: 34.49%; height: 39.19%;
  container-type: size;
  background: #0D0D0D; color: #F6F2E7; mix-blend-mode: multiply;
  clip-path: polygon(0 0, 98.75% 0.89%, 100% 98.02%, 0.57% 100%);
  overflow: hidden;
}
.pub-affiche__top {
  position: absolute; left: 7cqw; right: 7cqw; top: 6cqw;
  display: flex; justify-content: space-between; gap: 4cqw;
  font-family: var(--font-mono); font-weight: 500; font-size: 4.6cqw; line-height: 1.2;
  letter-spacing: 0.06em; text-transform: uppercase; white-space: nowrap;
}
.pub-affiche__word {
  position: absolute; left: 6cqw; bottom: 25cqh;
  font-family: var(--font-sans); font-weight: 800; font-size: 45cqw; line-height: 0.72; letter-spacing: -0.07em;
  white-space: nowrap;
}

/* Bande citron : « voit-elle » ne se coupe pas au trait d'union */
.pub-nowrap { white-space: nowrap; }
.pub-affiche__band {
  --c: 3cqw;
  position: absolute; left: 7cqw; right: 7cqw; bottom: 7cqw;
  padding: 4.2cqw 5cqw 4cqw; background: #CBFA5E; color: #0D0D0D;
  font-family: var(--font-mono); font-weight: 500; font-size: 4.4cqw; line-height: 1.2;
  letter-spacing: 0.04em; text-transform: uppercase; white-space: nowrap;
  clip-path: polygon(calc(var(--c) * 1.5) 0, 100% 0, 100% calc(100% - var(--c)), calc(100% - var(--c) * 1.5) 100%, 0 100%, 0 var(--c));
}

/* Exemples ALBA (22/10) */
.pub-exs { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--g, 24px); }
.pub-ex { display: flex; flex-direction: column; gap: 10px; }
.pub-ex .tag { align-self: flex-start; margin-top: 8px; }
.pub-ex__title { font-weight: 800; font-size: clamp(1.4rem, 2vw, 1.75rem); letter-spacing: -0.03em; line-height: 1.05; }
.pub-ex__text { color: var(--graphite); font-size: 1.0625rem; line-height: 1.45; }
.pub-ex__where { font-family: var(--font-mono); font-weight: 500; font-size: 0.75rem; letter-spacing: 0.08em; text-transform: uppercase; }
@media (max-width: 900px) { .pub-exs { grid-template-columns: 1fr; max-width: 460px; } }
.pub-exs { margin-top: clamp(28px, 4vw, 48px); }