/* Cie pm – ajustements du thème Bringer */

/* ============
   COULEURS : fond blanc, accent pastel (rose poudré) à la place du bleu
=============== */
:root {
    --bringer-s-body-bg: #FFFFFF;
    --bringer-s-nav: #FFFFFFE6;
    --bringer-s-container-bg: #F6F2F0;
    --bringer-s-container-frosted: #F6F2F0EE;
    --bringer-s-heading: #141414;
    --bringer-s-heading-fade: #141414B3;
    --bringer-s-text: #3C3C3C;

    /* Accent pastel : boutons, bandeau défilant */
    --bringer-s-accent: #F3CFC6;
    --bringer-button-hover-bg: #ECBDB1;
    --bringer-s-accented-text: #141414;
    /* Liens et petits accents : même teinte, plus foncée pour rester lisible */
    --bringer-s-text-accent: #B5685A;

    --bringer-s-border: #1414141F;
    --bringer-s-border-accent: #F3CFC6;
    --bringer-s-border-mute: #1414140D;
    --bringer-s-border-highlight: #14141426;
    --bringer-s-backlight: #F3CFC633;
    --bringer-s-box-shadow: #14141410;
}

/* Logo rond noir, d'origine */
.bringer-logo img {
    width: auto;
    height: 64px;
}
.bringer-mobile-header-inner .bringer-logo img {
    height: 48px;
}
.bringer-logo.footer-logo img {
    height: 96px;
}

/* Menu : 7 rubriques en capitales */
#bringer-header ul.main-menu > li > a {
    letter-spacing: 0.02em;
}

/* Diaporamas : photos entières, recadrées proprement */
.bringer-hero-type04 .swiper-slide img,
.bringer-slider-wrapper .swiper-slide img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* Cartes du carrousel : même format pour toutes les photos */
.bringer-carousel-card-image img {
    width: 100%;
    aspect-ratio: 4 / 5;
    object-fit: cover;
}

/* Fiches techniques (distribution, production) */
.ciepm-credits p {
    font-size: 0.95em;
    line-height: 1.7;
}
.ciepm-credits h5 {
    margin-bottom: 1em;
}

/* Liens précédent / suivant entre spectacles */
.ciepm-post-nav {
    display: flex;
    justify-content: space-between;
    gap: 2rem;
    flex-wrap: wrap;
}
.ciepm-post-nav .bringer-icon-link {
    flex: 1 1 300px;
}
.ciepm-post-nav .is-prev {
    text-align: left;
}
.ciepm-post-nav .is-next {
    text-align: right;
}

/* Menu mobile : CONTACT ajouté (bouton à part sur ordinateur), mots longs sans débordement */
#bringer-header .ciepm-mobile-only {
    display: none;
}
.bringer-mobile-menu a {
    font-size: clamp(18px, 6vw, 28px);
    overflow-wrap: anywhere;
}

/* Icône Linktree (absente de Bringer), même rendu que les autres réseaux */
.ciepm-socials-linktree i {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M13.6 6.4 17.5 2.4l2.3 2.3-4.1 3.9h5.8v3.3h-5.8l4.1 4-2.3 2.3-5.6-5.6-5.6 5.6L4 16l4.1-4H2.3V8.6h5.8L4 4.7l2.3-2.3 3.9 4V.6h3.4zM10.2 16.6h3.4v6.8h-3.4z'/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M13.6 6.4 17.5 2.4l2.3 2.3-4.1 3.9h5.8v3.3h-5.8l4.1 4-2.3 2.3-5.6-5.6-5.6 5.6L4 16l4.1-4H2.3V8.6h5.8L4 4.7l2.3-2.3 3.9 4V.6h3.4zM10.2 16.6h3.4v6.8h-3.4z'/%3E%3C/svg%3E");
}

/* ============
   PAGES GRILLE (Créations, Films, Avec les publics)
=============== */
/* Photos en noir & blanc qui passent en couleur au survol, comme sur l'ancien site */
.ciepm-card .bringer-portfolio-card-image img {
    -webkit-filter: grayscale(1);
    filter: grayscale(1);
    transition: filter .35s ease, -webkit-filter .35s ease;
}
.ciepm-card:hover .bringer-portfolio-card-image img,
.ciepm-card:focus-within .bringer-portfolio-card-image img {
    -webkit-filter: grayscale(0);
    filter: grayscale(0);
}
@media (hover: none) {
    /* Téléphones et tablettes : pas de survol possible, photos en couleur */
    .ciepm-card .bringer-portfolio-card-image img {
        -webkit-filter: none;
        filter: none;
    }
}
@media (prefers-reduced-motion: reduce) {
    .ciepm-card .bringer-portfolio-card-image img {
        transition: none;
    }
}
.ciepm-card .bringer-portfolio-card-image img {
    aspect-ratio: 59 / 30;
    object-fit: cover;
    width: 100%;
    height: auto;
}
/* Le modèle prévoit des vignettes carrées : on garde le format des photos du site */
.ciepm-card .bringer-portfolio-card-image {
    aspect-ratio: 59 / 30;
    height: auto;
}
.ciepm-card-text {
    padding: 0 24px 24px;
    font-size: 15px;
    line-height: 1.6;
}
.ciepm-card-text p {
    margin-bottom: 0.9em;
}
.ciepm-card-text .bringer-label {
    display: inline-block;
    margin-top: 0.4em;
}
.bringer-portfolio-card {
    display: flex;
    flex-direction: column;
}

/* ============
   CONTACT
=============== */
.ciepm-brevo-wrap {
    padding: 0;
    overflow: hidden;
}
iframe.ciepm-brevo {
    display: block;
    width: 100%;
    max-width: 540px;
    height: 800px;
    margin: 0 auto;
    border: 0;
}
.ciepm-contact-block {
    margin-bottom: 2em;
}
.ciepm-contact-block .bringer-label {
    display: block;
    margin-bottom: 0.6em;
}
.ciepm-small {
    font-size: 14px;
    line-height: 1.6;
}

/* ============
   AGENDA
=============== */
.ciepm-agenda-season .bringer-detailed-list-description p {
    margin-bottom: 1em;
}
/* Les liens dans les dates restent à leur place et cliquables au-dessus du lien de la ligne */
.bringer-detailed-list li .bringer-detailed-list-description a {
    position: relative;
    left: auto;
    top: auto;
    bottom: auto;
    right: auto;
    display: inline;
    z-index: 5;
    text-decoration: underline;
}

/* ============
   VIDÉOS
=============== */
.ciepm-video {
    position: relative;
    aspect-ratio: 16 / 9;
    margin-bottom: 1.2em;
}
.ciepm-video iframe {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    border: 0;
}

/* ============
   TITRES DE PAGE COMPACTS
=============== */
section.ciepm-page-head {
    padding-bottom: 24px;
}
.ciepm-page-head h1.bringer-page-title {
    font-size: clamp(32px, 4vw, 48px);
    margin: 0;
}
section.ciepm-page-head + section {
    padding-top: 0;
}

/* ============
   CONTENU REPRIS DE L'ANCIEN SITE (Présentation, LaDanseAimeLesGens, spectacles)
=============== */
.ciepm-flow h3 { font-size: clamp(26px, 3vw, 36px); margin-bottom: 0.6em; }
.ciepm-flow h4 { font-size: clamp(22px, 2.4vw, 28px); margin-bottom: 0.6em; }
.ciepm-flow h5 { font-size: 18px; letter-spacing: 0.02em; margin: 1.4em 0 0.7em; }
.ciepm-flow h5:first-child, .ciepm-flow h4:first-child, .ciepm-flow h3:first-child { margin-top: 0; }
.ciepm-flow h6 { font-size: 15px; line-height: 1.5; margin-bottom: 1em; }
.ciepm-flow p { margin-bottom: 1.1em; }
.ciepm-flow img { display: block; width: 100%; height: auto; border-radius: var(--bringer-xs-br, 8px); margin-bottom: 1.2em; }
.ciepm-flow a:not(.ciepm-link-button) { text-decoration: underline; text-underline-offset: 3px; }

/* Liens « → … » (dossier de presse, site du festival…) en boutons */
a.ciepm-link-button {
    display: inline-block;
    padding: 10px 18px;
    margin: 0 8px 10px 0;
    border-radius: 999px;
    background: var(--bringer-s-accent);
    color: var(--bringer-s-accented-text);
    font-weight: 700;
    font-size: 14px;
    text-decoration: none;
    transition: background-color .3s;
}
a.ciepm-link-button:hover { background: var(--bringer-button-hover-bg); }

/* ============
   PAGES PROJETS ET PRÉSENTATION : sections courtes et aérées, texte tout de suite sous le diaporama
=============== */
section.ciepm-post-head {
    padding: 48px 0 0;
}
section.ciepm-post-head .bringer-slider-wrapper,
section.ciepm-post-head .bringer-hero-media-wrap {
    margin-bottom: 0;
}
section.ciepm-post-head h1.bringer-post-title {
    font-size: clamp(36px, 5vw, 64px);
    margin-bottom: 0;
}
section.ciepm-post-section {
    padding: 56px 0 0;
}
section.ciepm-post-section h2 {
    font-size: clamp(30px, 3.4vw, 44px);
    margin-bottom: 0.3em;
}
section.ciepm-post-section h3 {
    font-size: clamp(24px, 2.6vw, 32px);
    margin-bottom: 0;
}
.ciepm-text p { margin-bottom: 1.1em; }
.ciepm-text h6 { font-size: 15px; line-height: 1.5; margin: 0 0 1em; }
.ciepm-text a:not(.ciepm-link-button):not(.bringer-button) { text-decoration: underline; text-underline-offset: 3px; }
.ciepm-text .bringer-large-text { margin-bottom: 0.8em; }
.ciepm-figure img { display: block; width: 100%; height: auto; border-radius: var(--bringer-xs-br, 8px); margin-bottom: 1.2em; }

/* Vidéos : une par ligne, ou en grille de 2 quand il y en a plusieurs */
.ciepm-videos-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 20px;
    margin-bottom: 1.2em;
}
.ciepm-videos-grid .ciepm-video { margin-bottom: 0; }
@media (max-width: 767px) {
    .ciepm-videos-grid { grid-template-columns: 1fr; }
}

/* Logos (plateformes VOD…) : 4 fois plus petits */
.ciepm-logos {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 24px;
    margin: 0.4em 0 1.4em;
}
.ciepm-logos a { display: inline-block; text-decoration: none; }
img.ciepm-logo {
    display: block;
    width: auto;
    height: 40px;
    max-width: none;
    margin: 0;
    border-radius: 0;
}
/* logos placés côte à côte, comme une rangée de boutons */
.ciepm-text p:has(img.ciepm-logo) {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 24px;
}
.ciepm-text p:has(img.ciepm-logo) a { text-decoration: none; }

/* Fiche technique : distribution, production… en 2 colonnes */
.ciepm-credits .ciepm-credit {
    font-size: 14px;
    line-height: 1.7;
}
.ciepm-credits .ciepm-credit h5 {
    font-size: 16px;
    letter-spacing: 0.04em;
    margin-bottom: 0.8em;
}
.ciepm-credits .ciepm-credit h6 { font-size: 14px; margin: 0 0 0.6em; }

/* Présentation : portrait à taille raisonnable, citations discrètes */
img.ciepm-portrait {
    display: block;
    width: 100%;
    max-width: 360px;
    height: auto;
    border-radius: var(--bringer-xs-br, 8px);
}
section.ciepm-quote-section {
    padding: 56px 0 0;
}

/* Pages grille : le menu surligné suffit, titre gardé pour les lecteurs d'écran et Google */
.ciepm-visually-hidden {
    position: absolute !important;
    width: 1px; height: 1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
    white-space: nowrap;
}
section.ciepm-grid-section {
    padding-top: 40px;
}

/* ============
   RÈGLE COMMUNE À TOUTES LES PAGES PROJETS (modèle GROTESQUE)
=============== */
/* Sous-titre toujours aligné à droite, au bord du diaporama */
.ciepm-title-row { margin-bottom: 24px; }
.ciepm-subtitle { text-align: right; }
.ciepm-subtitle h6 {
    margin: 0 0 0 auto;
    line-height: 1.5;
    text-align: right;
}
@media (max-width: 1024px) {
    .ciepm-subtitle, .ciepm-subtitle h6 { text-align: left; margin-top: 12px; }
}

/* Titres de section : texte juste en dessous */
.ciepm-head-row { margin-bottom: 12px; }
.ciepm-head-row h2, .ciepm-head-row h3 { margin-bottom: 0; }

/* Vidéos : toujours en pleine largeur, l'une sous l'autre */
.ciepm-text .ciepm-video { margin: 8px 0 24px; }

/* Citations : sur toute la largeur, auteur·ice à la ligne */
section.ciepm-quote-section { padding: 48px 0 0; }
blockquote.ciepm-quote {
    margin: 0 0 24px;
    padding: 0 0 0 24px;
    border-left: 4px solid var(--bringer-s-accent);
    background: none;
    text-align: left;
}
blockquote.ciepm-quote p {
    font-style: italic;
    font-size: clamp(18px, 2vw, 22px);
    line-height: 1.5;
    color: var(--bringer-s-heading);
    margin: 0 0 8px;
}
blockquote.ciepm-quote cite {
    font-style: normal;
    font-size: 14px;
    color: var(--bringer-s-text);
}

/* Fiche technique : même police et même taille partout (comme GROTESQUE) */
.ciepm-credits .ciepm-credit,
.ciepm-credits .ciepm-credit p,
.ciepm-credits .ciepm-credit h6,
.ciepm-credits .ciepm-credit strong {
    font-family: var(--bringer-t-content-ff);
    font-size: 14px;
    line-height: 1.7;
    font-weight: 400;
    letter-spacing: 0;
    text-transform: none;
}
.ciepm-credits .ciepm-credit p { margin: 0 0 0.8em; }
.ciepm-credits h5 {
    font-size: 16px;
    letter-spacing: 0.04em;
    margin: 0 0 0.8em;
}
/* Ligne CRÉATION : sur toute la largeur, au-dessus de distribution / production */
.ciepm-creation-line {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 6px 16px;
    padding-bottom: 20px;
    margin-bottom: 28px;
    border-bottom: 1px solid var(--bringer-s-border);
}
.ciepm-creation-line h5 { margin: 0; }

/* ============
   AJUSTEMENTS DE LECTURE (pages projets, Présentation, LaDanseAimeLesGens)
=============== */
/* Accroche sous le diaporama, précédée d'une étoile */
p.ciepm-accroche {
    position: relative;
    padding-left: 1.4em;
    margin: 0 0 0.8em;
    font-family: var(--bringer-t-heading-ff);
    font-weight: 700;
    font-size: clamp(24px, 2.6vw, 34px);
    line-height: 1.25;
    color: var(--bringer-s-heading);
}
p.ciepm-accroche::before {
    content: "⚹";
    position: absolute;
    left: 0;
    top: -0.05em;
    color: var(--bringer-s-text-accent);
}
section.ciepm-intro { padding-top: 40px; }

/* Texte courant : plus grand, interlignes plus serrés */
.ciepm-text,
.ciepm-text p,
.ciepm-text li {
    font-size: 18px;
    line-height: 1.5;
}
.ciepm-text p { margin-bottom: 0.9em; }
@media (max-width: 767px) {
    .ciepm-text, .ciepm-text p, .ciepm-text li { font-size: 17px; }
}

/* Citations : beaucoup plus grandes et en gras */
blockquote.ciepm-quote p {
    font-weight: 700;
    font-size: clamp(24px, 3vw, 36px);
    line-height: 1.3;
}
blockquote.ciepm-quote cite { font-size: 16px; }

/* Ligne CRÉATION : le texte continue sur la même ligne que le titre */
.ciepm-creation-line { flex-wrap: nowrap; }
.ciepm-creation-line .ciepm-credit { flex: 1 1 auto; }
@media (max-width: 767px) {
    .ciepm-creation-line { flex-wrap: wrap; }
}

/* Précédent à gauche, suivant à droite, toujours au bord */
.ciepm-post-nav .bringer-icon-link { flex: 1 1 0; display: flex; }
.ciepm-post-nav .is-prev { justify-content: flex-start; }
.ciepm-post-nav .is-prev .bringer-icon-link-content { text-align: left; }
.ciepm-post-nav .is-next { justify-content: flex-end; }
.ciepm-post-nav .is-next .bringer-icon-link-content { text-align: right; }
.ciepm-post-nav .bringer-next-post h2 { font-size: clamp(28px, 3.4vw, 48px); }

/* ============
   PAGES GRILLE : cartes plus compactes pour voir arriver la ligne suivante
=============== */
.ciepm-card-text {
    font-size: 14px;
    line-height: 1.45;
    padding: 0 20px 18px;
}
.ciepm-card-text p { margin-bottom: 0.6em; }
.ciepm-card .bringer-portfolio-card-footer { padding: 12px 20px 6px; }
.ciepm-card .bringer-portfolio-card-title h6 { font-size: 17px; line-height: 1.2; }
.ciepm-card .bringer-portfolio-card-title .bringer-meta { font-size: 11px; }

/* Ligne de contexte des projets avec les publics (« avec les patient·es… dans le cadre… »),
   sous l'accroche, sur toute la largeur */
p.ciepm-context {
    margin: 1.2em 0 1.4em;
    font-weight: 700;
    font-size: 18px;
    line-height: 1.5;
    color: var(--bringer-s-heading);
}
p.ciepm-accroche + p.ciepm-context { margin-top: 1.2em; }

/* Ligne CRÉATION en rose sur toutes les pages (texte et liens) */
.ciepm-creation-line .ciepm-credit,
.ciepm-creation-line .ciepm-credit a {
    color: var(--bringer-s-text-accent);
}

/* Vidéos en grille (monoDISCO : 4 par ligne) */
.ciepm-videos-grid.cols-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
@media (max-width: 1024px) { .ciepm-videos-grid.cols-4 { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 767px) { .ciepm-videos-grid.cols-4 { grid-template-columns: 1fr; } }

/* Presse : en italique, un peu plus petite que le texte courant */
.ciepm-press .ciepm-text,
.ciepm-press .ciepm-text p,
.ciepm-press .ciepm-text li {
    font-style: italic;
    font-size: 16px;
    line-height: 1.5;
}

/* Photo unique : même forme que les diaporamas (coins arrondis, encoches blanches, sans flèches) */
.ciepm-nav-static { pointer-events: none; }
.ciepm-nav-static .bringer-slider-prev,
.ciepm-nav-static .bringer-slider-next { cursor: default; }

/* Presse : encore plus petite (14 points) */
.ciepm-press .ciepm-text,
.ciepm-press .ciepm-text p,
.ciepm-press .ciepm-text li { font-size: 14px; }

/* Textes entre guillemets en italique (notes d'intention), sélections : un peu plus petits */
.ciepm-text p.ciepm-italic { font-size: 16px; font-style: italic; }

/* Ligne CRÉATION : titre et dates plus grands, en gras et en couleur */
.ciepm-creation-line h5 { font-size: 18px; }
.ciepm-creation-line .ciepm-credit,
.ciepm-creation-line .ciepm-credit a {
    font-size: 17px;
    font-weight: 700;
    color: var(--bringer-s-text-accent);
}

/* Remerciements, donateur·ices, listes longues : sur toute la largeur, sous les deux colonnes */
.ciepm-credits-wide { margin-top: 28px; display: grid; gap: 20px; }

/* Photo unique : un petit rond noir dans chaque encoche, à la place des flèches */
.ciepm-nav-static a::after {
    content: "";
    position: absolute;
    left: 50%;
    top: 50%;
    width: 8px;
    height: 8px;
    margin: -4px 0 0 -4px;
    border-radius: 50%;
    background: var(--bringer-s-heading);
}
.ciepm-nav-static a { position: relative; }

/* ============
   MENU : barre plus haute, logo et rubriques plus grands
=============== */
:root {
    --bringer-header-spacing: 22px;
    --bringer-t-menu-fs: 16px;
}
.bringer-header-inner .bringer-logo img { height: 88px; }
#bringer-header ul.main-menu > li > a { font-weight: 700; }
.bringer-header-rp .bringer-button { font-size: 16px; }
@media (max-width: 1024px) {
    :root { --bringer-header-spacing: 12px; }
    .bringer-mobile-header-inner .bringer-logo img { height: 56px; }
}

/* ============
   ACCUEIL : diaporama collé au menu, trois mentions plus grandes et en gras
=============== */
section.ciepm-home-hero { padding-top: 0; }
.ciepm-home-info > div,
.ciepm-home-info > div a {
    font-size: clamp(16px, 1.6vw, 22px);
    font-weight: 700;
    color: var(--bringer-s-heading);
    text-transform: none;
    letter-spacing: 0;
}

/* ============
   TEXTES JUSTIFIÉS (la dernière ligne et les lignes avant un retour à la ligne restent alignées à gauche)
=============== */
.ciepm-text p,
.ciepm-card-text p,
.bringer-detailed-list-description p,
.ciepm-credit p {
    text-align: justify;
    -webkit-hyphens: auto;
    hyphens: auto;
}
p.ciepm-accroche,
.ciepm-subtitle h6,
blockquote.ciepm-quote p { text-align: left; hyphens: manual; }

/* Sélections de festivals (Ça tourne !) : en gras */
.ciepm-text p.ciepm-selection { font-weight: 700; }

/* Dis-moi : revue de presse plus grande (citations courtes) */
.ciepm-press.is-big .ciepm-text,
.ciepm-press.is-big .ciepm-text p { font-size: 17px; }

/* Deux sections côte à côte (Dossier de presse / Disponible en VOD), interlignes resserrés */
section.ciepm-pair h4 { font-size: 20px; line-height: 1.3; margin-bottom: 0.5em; }
section.ciepm-pair .ciepm-text p { margin-bottom: 0.4em; }

/* Noms en gras dans les fiches techniques (une règle précédente les remettait en normal) */
.ciepm-credits .ciepm-credit strong,
.ciepm-credits .ciepm-credit b { font-weight: 700; }

/* Au-dessus du diaporama : toujours aligné à droite, sur ordinateur comme sur tablette */
.ciepm-subtitle, .ciepm-subtitle h6 { text-align: right; }
@media (max-width: 1024px) {
    .ciepm-subtitle, .ciepm-subtitle h6 { text-align: right; margin-top: 8px; }
}

/* Avec les publics : texte d'enjeu, puis « Avec … » et « En partenariat avec … », chacun à la ligne */
p.ciepm-enjeu { font-size: 18px; line-height: 1.5; margin: 0.6em 0 0.8em; }
p.ciepm-context { margin: 0 0 0.5em; }
p.ciepm-context.is-partners { font-weight: 400; margin-bottom: 1.4em; }
p.ciepm-context-old { margin: 0 0 1.4em; }

/* Cartes « Avec les publics » : publics et partenaires, chacun à la ligne */
.ciepm-card-text p.ciepm-card-avec { font-weight: 700; margin-bottom: 0.4em; }
.ciepm-card-text p.ciepm-card-partners { font-size: 13px; margin-bottom: 0.6em; }

/* Pied de page : bandeau newsletter */
.ciepm-footer-newsletter {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 16px 24px;
    margin-top: 40px;
    padding: 20px 24px;
    border-radius: var(--bringer-s-br, 12px);
    background: var(--bringer-s-container-bg);
}
.ciepm-footer-newsletter strong { display: block; font-size: 16px; color: var(--bringer-s-heading); }
.ciepm-footer-newsletter span { font-size: 15px; }
.bringer-footer-line a { text-decoration: underline; }
.ciepm-a-completer { background: #FFF1B8; padding: 0 4px; border-radius: 3px; font-weight: 700; }

/* ============
   RETOUCHES (accueil, Présentation, cartes, vidéos, durées)
=============== */
/* Accueil : « création, diffusion et médiation culturelle » en rose, sur une ligne ; « Cie pm » remonté et plus petit */
.ciepm-home-info > div:first-child,
.ciepm-home-info > div:first-child a {
    color: var(--bringer-s-text-accent);
    font-size: clamp(14px, 1.3vw, 18px);
    white-space: nowrap;
}
.bringer-hero-type04 .stg-bottom-gap:has(> .ciepm-home-title) { margin-bottom: 0; }
h1.ciepm-home-title {
    font-size: clamp(32px, 4vw, 52px);
    margin: -8px 0 0;
}

/* Texte et titre alignés en haut, le long de la photo (Accueil, Présentation) */
.ciepm-about-row { align-items: flex-start; }
.ciepm-about-row h3 { margin-top: 0; }
.ciepm-about-row p { text-align: left; }
.ciepm-bio-row { margin-bottom: 12px; }
.ciepm-bio-row + .stg-row { margin-top: 0; }

/* Cartes des pages grille : pas d'espace sous « + D'INFOS », lignes de cartes plus serrées */
.ciepm-card-text { padding-bottom: 12px; }
.ciepm-card-text .bringer-label { margin-top: 0.2em; margin-bottom: 0; }
.ciepm-card-text p:last-of-type { margin-bottom: 0.4em; }
.ciepm-grid-section .stg-normal-gap { --stg-gap: 20px; row-gap: 20px; }

/* Vidéos : moins d'espace au-dessus et en dessous */
.ciepm-text .ciepm-video { margin: 0 0 8px; }
section.ciepm-post-section:has(.ciepm-video):not(:has(p)) { padding-top: 24px; }
section.ciepm-post-section:has(.ciepm-video):not(:has(p)) + section.ciepm-post-section { padding-top: 24px; }
section.ciepm-quote-section { padding-top: 24px; }
section.ciepm-quote-section + section.ciepm-post-section { padding-top: 24px; }

/* Durée : 3e ligne au-dessus du diaporama, en gras et plus grande */
.ciepm-subtitle .ciepm-duree { display: inline-block; margin-top: 6px; font-size: 18px; font-weight: 700; color: var(--bringer-s-heading); }

/* Dis-moi : sortie au cinéma, en grand et souligné */
p.ciepm-release {
    font-size: clamp(20px, 2vw, 26px);
    font-weight: 700;
    text-decoration: underline;
    text-underline-offset: 5px;
    margin: 0 0 0.8em;
}

/* Ligne CRÉATION normée : « CRÉATION | date », puis « ⚹ | lieu » */
.ciepm-creation-line {
    display: grid;
    grid-template-columns: max-content 1fr;
    column-gap: 18px;
    row-gap: 2px;
    align-items: baseline;
}
.ciepm-creation-line h5 { margin: 0; white-space: nowrap; }
.ciepm-creation-line .ciepm-cplace { margin-bottom: 8px; }
.ciepm-cstar {
    color: var(--bringer-s-text-accent);
    font-weight: 700;
    font-size: 20px;
    justify-self: end;
}
.ciepm-creation-line .ciepm-cstar { justify-self: start; }

/* Accueil et Présentation : texte placé à gauche de la photo → aligné à droite, le long de la photo (ordinateur) */
@media (min-width: 1025px) {
    .ciepm-about-row > div:first-child:not(:has(.bringer-parallax-media)),
    .ciepm-about-row > div:first-child:not(:has(.bringer-parallax-media)) h2,
    .ciepm-about-row > div:first-child:not(:has(.bringer-parallax-media)) h3,
    .ciepm-about-row > div:first-child:not(:has(.bringer-parallax-media)) p {
        text-align: right;
    }
    .ciepm-about-row > div:first-child:not(:has(.bringer-parallax-media)) .align-right { text-align: right; }
}

/* Étoile de la ligne CRÉATION : en gras, plus grande, alignée à droite sous le « N » de CRÉATION */
.ciepm-creation-line .ciepm-cstar {
    justify-self: end;
    font-size: 24px;
    font-weight: 900;
    line-height: 1;
}

/* Accroche sur plusieurs lignes (COMPOST) : chaque ligne avec son étoile, toutes alignées */
p.ciepm-accroche.is-multi { padding-left: 0; }
p.ciepm-accroche.is-multi::before { content: none; }
p.ciepm-accroche .ciepm-acc-line { display: block; position: relative; padding-left: 1.4em; }
p.ciepm-accroche .ciepm-acc-line::before {
    content: "⚹";
    position: absolute;
    left: 0;
    top: -0.05em;
    color: var(--bringer-s-text-accent);
}

/* Titres longs (ATLAS INTIME DE BOUGAINVILLE…) : plus petits pour tenir sur une ligne */
section.ciepm-post-head h1.bringer-post-title.is-long { font-size: clamp(28px, 3vw, 44px); }

/* Accueil : « La compagnie » et son texte alignés à droite, phrase « Elle développe… » sur une ligne */
.ciepm-compagnie-text { font-size: clamp(17px, 1.45vw, 21px); line-height: 1.55; }

/* Présentation : « La compagnie » plus aéré, espace sous les titres « La compagnie » et « → Créations » */
.ciepm-about-row h3 { margin-bottom: 0.7em; }
.ciepm-about-row .ciepm-text p { line-height: 1.75; }
.ciepm-compagnie-text { font-size: clamp(15px, 1.25vw, 18px); }
@media (min-width: 1025px) { .ciepm-oneline { white-space: nowrap; } }
.ciepm-creation-line + .ciepm-creation-line { margin-top: -16px; border-top: 0; }
.ciepm-creation-line:has(+ .ciepm-creation-line) { border-bottom: 0; margin-bottom: 0; padding-bottom: 12px; }
section.ciepm-post-section .ciepm-about-row h3 { margin-bottom: 0.7em; }

/* Circuits : définitions « Autisme » et « Circuit » en petit, avec une étoile noire */
#ciepm-definitions,
#ciepm-definitions p {
    font-size: 13px;
    line-height: 1.5;
    font-style: normal;
    margin: 0 0 1em;
    padding: 0;
    border: 0;
    background: none;
}
#ciepm-definitions span { color: var(--bringer-s-heading); font-weight: 900; margin-right: 4px; }

/* monoDISCO : portraits vidéo verticaux (format 3:4) qui remplissent toute la case, 2 lignes de 4 */
.ciepm-videos-grid.cols-4 { gap: 16px; }
.ciepm-videos-grid.cols-4 .ciepm-video { aspect-ratio: 3 / 4; }

/* Accueil : encoche « Cie pm » en haut à gauche du diaporama (même taille que l'encoche des flèches) */
.ciepm-double-mask { position: relative; --masked-border-radius: var(--bringer-default-br); }
.ciepm-notch-tl {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 5;
    padding: 0 16px 16px 0;
}
.ciepm-notch-tl h1.ciepm-badge-title {
    height: 64px;
    display: flex;
    align-items: center;
    margin: 0;
    padding: 0 8px 0 0;
    font-size: clamp(28px, 2.6vw, 40px);
    font-weight: 900;
    line-height: 1;
    letter-spacing: -0.02em;
    white-space: nowrap;
}

/* Présentation : texte de « La compagnie » réparti sur toute la hauteur de la photo, aligné à droite */
@media (min-width: 1025px) {
    .ciepm-about-row:has(.ciepm-spread) { align-items: stretch; }
    .ciepm-about-row > div:has(> .ciepm-spread) { display: flex; flex-direction: column; text-align: right; }
    .ciepm-spread { flex: 1; display: flex; flex-direction: column; justify-content: space-between; text-align: right; }
}
.ciepm-spread .ciepm-line { display: block; font-size: 18px; line-height: 1.5; }

/* Titre sur une seule ligne au-dessus du diaporama (OPERAtion Lipdub, LET'S DANCE IN PAU…), sous-titre à droite */
@media (min-width: 1025px) {
    .ciepm-title-row { display: flex; flex-wrap: nowrap; align-items: flex-end; gap: 32px; }
    .ciepm-title-row > div:first-child { flex: 0 0 auto; width: auto; max-width: 70%; }
    .ciepm-title-row > .ciepm-subtitle { flex: 1 1 0; width: auto; max-width: none; }
    .ciepm-title-row h1.bringer-post-title { white-space: nowrap; }
}

/* « PLUS D'INFOS » : les boutons côte à côte, centrés sur une seule ligne */
section.ciepm-buttons .ciepm-head-row h3 { text-align: center; }
section.ciepm-buttons .ciepm-text {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    gap: 16px 24px;
}
section.ciepm-buttons .ciepm-text h6 { margin: 0; }
section.ciepm-buttons .ciepm-text h6 br { display: none; }
section.ciepm-buttons a.ciepm-link-button { margin: 0; }
section.ciepm-buttons .ciepm-text > h6 { flex: 0 0 auto; width: auto; display: block; }
section.ciepm-buttons .ciepm-text { flex-direction: row; }
section.ciepm-buttons .ciepm-head-row > div,
section.ciepm-buttons .ciepm-head-row h3 { display: block; width: 100%; text-align: center; }

/* LaDanseAimeLesGens : édito un peu plus petit, en italique */
.ciepm-text.ciepm-edito p { font-size: 0.92em; font-style: italic; }

/* Accueil : titre « La compagnie », texte et phrase « Ce travail… » alignés à droite */
@media (min-width: 768px) {
    .ciepm-home-compagnie,
    .ciepm-home-compagnie h3,
    .ciepm-home-compagnie p { text-align: right; }
}

/* Présentation : texte de « La compagnie » centré entre le haut et le bas de la photo, interlignes resserrés */
@media (min-width: 1025px) {
    .ciepm-about-row:has(.ciepm-spread) { align-items: center; }
    .ciepm-about-row > div:has(> .ciepm-spread) { justify-content: center; }
    .ciepm-about-row > div:has(> .ciepm-spread) h3 { text-align: right; }
    .ciepm-spread { flex: 0 0 auto; justify-content: flex-start; gap: 0.35em; }
}
.ciepm-spread .ciepm-line { line-height: 1.45; }

/* Pied de page resserré : moins de vide en haut et en bas, objets plus proches */
.bringer-footer-widgets { padding: 28px 0 20px; }
.bringer-logo.footer-logo img { height: 64px; }
.bringer-info-widget .bringer-logo { margin: 0 0 10px; }
.bringer-info-description { margin-bottom: 12px; line-height: 1.5; }
.bringer-menu-widget a { padding: 3px 8px; }
.bringer-menu-widget ul { margin: -3px 0; }
.ciepm-footer-newsletter { margin-top: 20px; padding: 12px 20px; gap: 10px 20px; }
.bringer-footer-line { padding: 12px 0; }
.ciepm-about-row > div:has(> .ciepm-spread) h3,
.ciepm-home-compagnie h3 { align-self: stretch; width: 100%; }
.ciepm-home-compagnie > * { align-self: stretch; width: 100%; }

/* Photo unique : une étoile ⚹ dans chaque encoche, à la place du petit rond */
.ciepm-nav-static a::after {
    content: "⚹";
    width: auto;
    height: auto;
    margin: 0;
    border-radius: 0;
    background: none;
    transform: translate(-50%, -52%);
    font-size: 22px;
    font-weight: 900;
    line-height: 1;
    color: var(--bringer-s-heading);
}

/* Pages projets : titre plus proche du menu du haut */
section.ciepm-post-head { padding-top: 16px; }

/* Pages grille : au survol, toute la carte (titre et texte) s'agrandit de 15 % et la photo, en couleur, encore davantage (environ +50 %)
   et sort de la grille, pour pouvoir tout lire (ordinateur seulement ; vers l'intérieur de la page pour les colonnes du bord). */
@media (hover: hover) and (min-width: 1025px) {
    /* sélecteurs renforcés : l'animation d'apparition du thème pose aussi un « transform » sur les cartes */
    [class*="bringer-grid"] > .ciepm-card.ciepm-card {
        transform-origin: center top;
        transition: opacity .6s ease, transform .45s cubic-bezier(.2, .7, .2, 1), box-shadow .45s ease, z-index 0s .45s;
    }
    [class*="bringer-grid"] > .ciepm-card.ciepm-card:hover {
        transform: translateY(var(--ciepm-dy, 0px)) scale(1.15);   /* --ciepm-dy : décalage pour ne pas passer sous le menu (js/ciepm.js) */
        z-index: 50;
        box-shadow: 0 30px 80px rgba(0, 0, 0, .25);
        transition: transform .45s cubic-bezier(.2, .7, .2, 1), box-shadow .45s ease, z-index 0s 0s;
    }
    /* la photo grandit en plus (1,15 × 1,3 ≈ 1,5) vers le haut et les côtés, sans recouvrir le titre */
    [class*="bringer-grid"] > .ciepm-card .bringer-portfolio-card-image {
        transform-origin: center bottom;
        transition: transform .45s cubic-bezier(.2, .7, .2, 1), box-shadow .45s ease;
        position: relative;
        z-index: 2;
    }
    [class*="bringer-grid"] > .ciepm-card.ciepm-card:hover .bringer-portfolio-card-image {
        transform: scale(1.3);
        box-shadow: 0 20px 50px rgba(0, 0, 0, .25);
    }
    .bringer-grid-3cols > .ciepm-card:nth-child(3n+1) .bringer-portfolio-card-image,
    .bringer-grid-2cols > .ciepm-card:nth-child(odd) .bringer-portfolio-card-image { transform-origin: left bottom; }
    .bringer-grid-3cols > .ciepm-card:nth-child(3n) .bringer-portfolio-card-image,
    .bringer-grid-2cols > .ciepm-card:nth-child(even) .bringer-portfolio-card-image { transform-origin: right bottom; }
    .bringer-grid-3cols > .ciepm-card.ciepm-card:nth-child(3n+1),
    .bringer-grid-2cols > .ciepm-card.ciepm-card:nth-child(odd) { transform-origin: left top; }
    .bringer-grid-3cols > .ciepm-card.ciepm-card:nth-child(3n),
    .bringer-grid-2cols > .ciepm-card.ciepm-card:nth-child(even) { transform-origin: right top; }
}
@media (prefers-reduced-motion: reduce) {
    [class*="bringer-grid"] > .ciepm-card.ciepm-card:hover,
    [class*="bringer-grid"] > .ciepm-card.ciepm-card:hover .bringer-portfolio-card-image { transform: none; }
}


/* Pages grille : « + D'INFOS » au plus près du bas de la carte la plus longue de chaque rangée */
.ciepm-card.bringer-block { padding-bottom: 10px; }
.ciepm-card .ciepm-card-text { padding-bottom: 0; }
.ciepm-card .ciepm-card-text > :last-child { margin-bottom: 0; }

/* Pages projets : la photo de la création précédente (à gauche) et suivante (à droite) dépasse sur les bords de la
   fenêtre, comme les diapositives voisines d'un carrousel, avec une flèche ; au survol elle glisse vers l'intérieur
   et montre l'année et le nom. Elles restent en place pendant le défilement. */
.ciepm-edge {
    --w: 280px;          /* largeur de la photo */
    --peek: 64px;        /* partie visible au repos */
    position: fixed;
    top: 50%;
    z-index: 45;
    width: var(--w);
    height: 168px;
    overflow: hidden;
    border-radius: var(--bringer-small-br, 14px);
    background: #222;
    color: #fff;
    text-decoration: none;
    box-shadow: 0 10px 30px rgba(0, 0, 0, .22);
    transition: transform .45s cubic-bezier(.2, .7, .2, 1), opacity .3s ease, box-shadow .3s ease;
}
.ciepm-edge.is-prev { left: 0; transform: translate(calc(var(--peek) - var(--w)), -50%); border-radius: 0 var(--bringer-small-br, 14px) var(--bringer-small-br, 14px) 0; }
.ciepm-edge.is-next { right: 0; transform: translate(calc(var(--w) - var(--peek)), -50%); border-radius: var(--bringer-small-br, 14px) 0 0 var(--bringer-small-br, 14px); }
.ciepm-edge:hover, .ciepm-edge:focus-visible { transform: translate(0, -50%); box-shadow: 0 16px 44px rgba(0, 0, 0, .3); }
.ciepm-edge img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; filter: grayscale(1) brightness(.75); transition: filter .4s ease; }
.ciepm-edge:hover img, .ciepm-edge:focus-visible img { filter: none; }
.ciepm-edge-arrow {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    display: grid;
    place-items: center;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: var(--bringer-s-text-accent, #E8B4AE);
    color: var(--bringer-s-heading);
    font-size: 20px;
    font-weight: 900;
    line-height: 1;
    box-shadow: 0 4px 14px rgba(0, 0, 0, .25);
    transition: opacity .3s ease;
}
.ciepm-edge.is-prev .ciepm-edge-arrow { right: calc((var(--peek) - 40px) / 2); }
.ciepm-edge.is-next .ciepm-edge-arrow { left: calc((var(--peek) - 40px) / 2); }
.ciepm-edge:hover .ciepm-edge-arrow { opacity: 0; }
.ciepm-edge-text {
    position: absolute;
    left: 0; right: 0; bottom: 0;
    display: flex;
    flex-direction: column;
    padding: 28px 14px 12px;
    line-height: 1.15;
    background: linear-gradient(transparent, rgba(0, 0, 0, .7));
    opacity: 0;
    transition: opacity .3s ease .1s;
}
.ciepm-edge.is-next .ciepm-edge-text { align-items: flex-end; text-align: right; }
.ciepm-edge:hover .ciepm-edge-text, .ciepm-edge:focus-visible .ciepm-edge-text { opacity: 1; }
.ciepm-edge-text small { font-size: 10px; font-weight: 700; letter-spacing: .06em; opacity: .85; }
.ciepm-edge-text strong { font-size: 16px; font-weight: 900; text-transform: uppercase; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 100%; }
.ciepm-edge.is-hidden { opacity: 0; pointer-events: none; }
@media (max-width: 767px) {
    /* téléphone : petites vignettes en bas des bords */
    .ciepm-edge { --w: 150px; --peek: 46px; top: auto; bottom: 16px; height: 84px; }
    .ciepm-edge.is-prev { transform: translateX(calc(var(--peek) - var(--w))); }
    .ciepm-edge.is-next { transform: translateX(calc(var(--w) - var(--peek))); }
    .ciepm-edge:hover { transform: none; }
    .ciepm-edge-arrow { width: 32px; height: 32px; font-size: 16px; }
    .ciepm-edge.is-prev .ciepm-edge-arrow { right: 7px; }
    .ciepm-edge.is-next .ciepm-edge-arrow { left: 7px; }
    .ciepm-edge-text { display: none; }
}
@media (prefers-reduced-motion: reduce) {
    .ciepm-edge, .ciepm-edge img, .ciepm-edge-text { transition: none; }
}

/* Bas des pages projets : lien vers la rubrique (CRÉATIONS, FILMS…) plus gros, collé au pied de page */
section.ciepm-post-nav-section { padding-bottom: 28px; }
a.bringer-arrow-link.ciepm-back-link { font-size: 22px; font-weight: 900; letter-spacing: .04em; }

/* Page Vidéos : deux bandeaux par ligne, plus hauts, avec le visuel de la vidéo à droite
   (noir et blanc, couleur au survol comme les cartes) ; une vidéo ouverte prend toute la largeur pour être bien vue */
.bringer-faq-list.ciepm-videos-2cols { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; align-items: start; }
.ciepm-videos-2cols .bringer-toggles-item.is-active { grid-column: 1 / -1; }
.ciepm-vtitle { display: flex; align-items: center; gap: 20px; }
.ciepm-vtitle-text { flex: 1 1 auto; min-width: 0; }
.ciepm-vtitle h4 { padding-right: 52px; font-size: clamp(19px, 1.85vw, 26px); }   /* le plus long titre ne touche jamais la flèche */
.ciepm-vtitle i.bringer-icon { right: calc(48% + 14px); }
.ciepm-vthumb {
    flex: 0 0 48%;
    width: 48%;
    aspect-ratio: 16 / 9;
    height: auto;
    object-fit: cover;
    border-radius: var(--bringer-small-br, 12px);
    filter: grayscale(1);
    transition: filter .35s ease;
}
.bringer-toggles-item:hover .ciepm-vthumb, .bringer-toggles-item.is-active .ciepm-vthumb { filter: none; }
.ciepm-videos-2cols .bringer-toggles-item.is-active .ciepm-vthumb { flex-basis: 24%; width: 24%; }
.ciepm-videos-2cols .bringer-toggles-item.is-active .ciepm-vtitle i.bringer-icon { right: calc(24% + 14px); }
@media (hover: none) { .ciepm-vthumb { filter: none; } }
@media (max-width: 1024px) {
    .bringer-faq-list.ciepm-videos-2cols { grid-template-columns: 1fr; }
}
@media (max-width: 600px) {
    .ciepm-vtitle { gap: 12px; }
    .ciepm-vthumb { flex-basis: 42%; width: 42%; }
    .ciepm-vtitle i.bringer-icon { display: none; }
    .ciepm-vtitle h4 { padding-right: 0; font-size: 16px; }
}

/* Photos des créations voisines : plus hautes, titres en blanc bien lisibles */
.ciepm-edge { height: 260px; --w: 340px; --peek: 72px; }
.ciepm-edge .ciepm-edge-text, .ciepm-edge .ciepm-edge-text small, .ciepm-edge .ciepm-edge-text strong { color: #fff !important; text-shadow: 0 1px 6px rgba(0, 0, 0, .6); }
.ciepm-edge .ciepm-edge-text { padding: 48px 16px 16px; background: linear-gradient(transparent, rgba(0, 0, 0, .8)); }
.ciepm-edge .ciepm-edge-text strong { font-size: 18px; }
.ciepm-edge .ciepm-edge-text small { font-size: 11px; }
@media (max-width: 767px) { .ciepm-edge { height: 96px; --w: 160px; --peek: 46px; } }
/* Page Vidéos : visuels toujours en couleur */
.ciepm-vthumb { filter: none; }

/* Agenda : lieux en gras ; leurs liens passent au-dessus du lien de la ligne (vers la page du projet) */
.bringer-detailed-list-description strong.ciepm-venue { font-weight: 800; }
.bringer-detailed-list-description a { position: relative; z-index: 5; }
.bringer-detailed-list-description a.ciepm-venue-link { color: inherit; text-decoration: underline; text-decoration-color: var(--bringer-s-text-accent, #E8B4AE); text-decoration-thickness: 2px; text-underline-offset: 3px; }
.bringer-detailed-list-description a.ciepm-venue-link:hover { text-decoration-color: currentColor; }


/* Photos des créations voisines : texte blanc plus grand */
.ciepm-edge { --w: 380px; }
.ciepm-edge .ciepm-edge-text strong { font-size: 23px; line-height: 1.1; }
.ciepm-edge .ciepm-edge-text small { font-size: 13px; }

/* Agenda : seuls la flèche (vers le spectacle) et le nom du lieu (vers son site) réagissent au survol ;
   ni la ligne, ni la carte, ni les dates */
.ciepm-agenda-season .bringer-detailed-list li a { position: relative; inset: auto; display: inline; }
.ciepm-agenda-season .bringer-detailed-list li a.ciepm-agenda-go { display: flex; }
.ciepm-agenda-season .bringer-detailed-list li:hover::before { opacity: 0 !important; }
.ciepm-agenda-season .bringer-detailed-list li:has(a):hover .bringer-detailed-list-button { background: none; border-color: var(--bringer-s-heading); }
.ciepm-agenda-season .bringer-detailed-list li:has(a):hover .bringer-detailed-list-button .bringer-icon { background-color: var(--bringer-s-heading); }
.ciepm-agenda-season .bringer-detailed-list li a.ciepm-agenda-go:hover { background: var(--bringer-s-accent); border-color: var(--bringer-s-border-accent); }
.ciepm-agenda-season .bringer-detailed-list li a.ciepm-agenda-go:hover .bringer-icon { background-color: var(--bringer-s-accented-text); }
.ciepm-agenda-season .bringer-detailed-list li { cursor: default; }

/* Page Vidéos : sous la vidéo, bouton vers le spectacle et bouton « Replier » */
.ciepm-vactions { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 12px 20px; margin-top: 20px; }
.ciepm-vclose {
    border: 2px solid var(--bringer-s-heading);
    background: transparent;
    color: var(--bringer-s-heading);
    border-radius: 999px;
    padding: 10px 20px;
    font: inherit;
    font-weight: 800;
    font-size: 14px;
    letter-spacing: .04em;
    text-transform: uppercase;
    cursor: pointer;
    transition: background-color .25s ease, color .25s ease;
}
.ciepm-vclose:hover { background: var(--bringer-s-heading); color: #fff; }
/* bouton de repli = la même flèche que celle du bandeau (même dessin, même taille, même sens) */
.ciepm-vclose { border: 0; padding: 0; width: 32px; height: 32px; border-radius: 0; background: none; display: inline-grid; place-items: center; }
.ciepm-vclose:hover { background: none; }
.ciepm-vclose i.bringer-icon { width: 32px; height: 32px; margin: 0; transform: rotate(0deg) translate(0, 12px); }
.ciepm-vactions { justify-content: space-between; }
/* flèche de repli tournée vers le haut */
.ciepm-vclose i.bringer-icon { transform: rotate(180deg); }

/* Toutes les pages de rubrique : le contenu commence juste sous le menu, sans espace vide
   (même hauteur que Créations, Films, Vidéos ; les pages projets gardent leur réglage validé) */
#bringer-main .stg-container > section:first-of-type:not(.ciepm-post-head):not(.ciepm-home-hero) { padding-top: 40px; }
section.ciepm-post-head:has(h1.ciepm-visually-hidden) { padding-top: 40px; }
section.ciepm-post-head:has(h1.ciepm-visually-hidden) .ciepm-title-row { margin: 0; height: 0; overflow: hidden; }
section.ciepm-post-head:has(h1.ciepm-visually-hidden) .ciepm-title-row { position: absolute; }

/* 30 px entre le contenu et le pied de page (toutes les pages) */
main > .stg-container > section:last-of-type, main > section:last-of-type { padding-bottom: 30px !important; margin-bottom: 0 !important; }
main > .stg-container:last-child, main:last-child { padding-bottom: 0 !important; margin-bottom: 0 !important; }

/* Présentation : photos sans zoom (pas d'effet de parallaxe) ; les 2e et 3e photos prennent la hauteur du texte voisin
   (de « Créations » à « oN|oFF », et le texte des Résidences), cadrées sur l'image d'origine entière */
.ciepm-about-row .bringer-parallax-media img { transform: none !important; }
@media (min-width: 768px) {
    .ciepm-about-tall { align-items: stretch; }
    .ciepm-about-tall > div:has(.bringer-parallax-media) { display: flex; flex-direction: column; }
    .ciepm-about-tall .bringer-parallax-media { flex: 1 1 auto; height: auto !important; position: relative; min-height: 300px; }
    .ciepm-about-tall .bringer-parallax-media .st-lazy-wrapper { position: absolute; top: 0; left: 0; width: 100%; height: 100% !important; }
    .ciepm-about-tall .bringer-parallax-media img { position: absolute; top: 0; left: 0; width: 100%; height: 100% !important; object-fit: cover; }
    .ciepm-about-tall .ciepm-text > :last-child { margin-bottom: 0; padding-bottom: 0; }
}

/* Accueil : points de navigation sous les photos des rubriques, plus gros et plus faciles à cliquer */
.bringer-carousel .bringer-dots { height: auto !important; margin-top: 28px; }
.bringer-carousel .bringer-dots .swiper-pagination-bullet { width: 20px !important; height: 20px !important; margin: 0 9px !important; }

/* Accueil : moins d'espace autour du bloc « La compagnie » (texte + photo de TOTEM) et avant les photos des rubriques */
main section:has(.ciepm-home-compagnie) { padding-top: 40px !important; padding-bottom: 32px !important; }   /* aussi moins d'espace au-dessus */
main section:has(> .bringer-carousel) { padding-top: 32px !important; }

/* Présentation : le portrait de Philippe Ménard aligné sur le haut des lettres de la 1re ligne du texte */
@media (min-width: 768px) { .ciepm-bio-row .ciepm-portrait { margin-top: 10px; } }

/* Présentation : ligne vide après « … autour de quatre axes : » */
.ciepm-spread .ciepm-line.ciepm-line-gap { margin-bottom: 1.45em; }

/* Présentation : 3 petites photos sous « Actions artistiques » */
.ciepm-petites-photos { margin-top: 32px; }
.ciepm-petite-photo { display: block; width: 100%; height: auto; aspect-ratio: 3 / 2; object-fit: cover; border-radius: var(--bringer-small-br, 12px); }
@media (max-width: 739px) { .ciepm-petites-photos > div + div { margin-top: 16px; } }
.ciepm-petite-lien { display: block; border-radius: var(--bringer-small-br, 12px); overflow: hidden; }
.ciepm-petite-lien .ciepm-petite-photo { transition: transform .45s cubic-bezier(.2, .7, .2, 1); }
.ciepm-petite-lien:hover .ciepm-petite-photo { transform: scale(1.05); }
/* année et nom du projet en blanc au survol, même type et même style que les photos voisines des pages projets */
.ciepm-petite-lien { position: relative; }
.ciepm-petite-nom {
    position: absolute; left: 0; right: 0; bottom: 0;
    display: flex; flex-direction: column;
    padding: 48px 16px 16px; line-height: 1.15;
    background: linear-gradient(transparent, rgba(0, 0, 0, .8));
    opacity: 0; transition: opacity .3s ease .1s;
}
.ciepm-petite-lien:hover .ciepm-petite-nom, .ciepm-petite-lien:focus-visible .ciepm-petite-nom { opacity: 1; }
.ciepm-petite-nom small, .ciepm-petite-nom strong { color: #fff !important; text-shadow: 0 1px 6px rgba(0, 0, 0, .6); }
.ciepm-petite-nom small { font-size: 10px; font-weight: 700; letter-spacing: .06em; opacity: .85; }
.ciepm-petite-nom strong { font-size: 18px; font-weight: 900; text-transform: uppercase; }
@media (hover: none) { .ciepm-petite-nom { opacity: 1; } }   /* sur téléphone (pas de survol) : toujours visible */

/* Présentation : 40 px visibles au-dessus et en dessous de la citation de Laurent Gaudé (paddings ajustés à l’interligne) */
.ciepm-quote-serree { padding-top: 48px !important; padding-bottom: 44px !important; margin-top: 0 !important; margin-bottom: 0 !important; }
.ciepm-quote-serree .ciepm-quote { margin-top: 0 !important; margin-bottom: 0 !important; }
main section:has(+ .ciepm-quote-serree) { padding-bottom: 0 !important; margin-bottom: 0 !important; }
main section:has(+ .ciepm-quote-serree) .stg-row:last-child, main section:has(+ .ciepm-quote-serree) .ciepm-text > :last-child { margin-bottom: 0 !important; padding-bottom: 0 !important; }
.ciepm-quote-serree + section { padding-top: 0 !important; margin-top: 0 !important; }

/* Téléphone : la ligne CRÉATION ne déborde plus (titre long comme « CRÉATION ESPACE PUBLIC » sur deux lignes) */
@media (max-width: 600px) {
    .ciepm-creation-line { grid-template-columns: fit-content(52%) minmax(0, 1fr); }
    .ciepm-creation-line h5 { white-space: normal; }
    .ciepm-creation-line .ciepm-credit { min-width: 0; overflow-wrap: anywhere; }
}

/* Téléphone : les photos des créations voisines recouvraient le texte des fiches → masquées
   (la navigation précédent / suivant reste en bas de page) */
@media (max-width: 767px) { .ciepm-edge { display: none !important; } }

/* Téléphone (Présentation) : photos ROCK et AIR cadrées comme sur ordinateur (sans l'homme accroupi à côté de l'enfant),
   et pas de coupure de mots avec trait d'union dans les noms de lieux */
@media (max-width: 767px) {
    .ciepm-about-tall .bringer-parallax-media img { aspect-ratio: 1 / 1; height: auto !important; object-fit: cover; }
    .ciepm-about-row .ciepm-text, .ciepm-about-row .ciepm-text p { hyphens: manual; -webkit-hyphens: manual; }
}

/* Agenda sur tablette (740–960 px) : colonne des titres au tiers, comme sur ordinateur, pour que
   HYBRIDATION(S) ou CABANES CHORÉGRAPHIQUES ne chevauchent pas les lieux */
@media only screen and (min-width: 740px) and (max-width: 960px) {
    .ciepm-agenda-season .bringer-detailed-list-title {
        min-width: calc(33.333% - var(--stg-gap));
        max-width: calc(33.333% - var(--stg-gap));
    }
    .ciepm-agenda-season .bringer-detailed-list-description {
        min-width: calc(66.666% - 2 * var(--stg-gap) - 64px);
        max-width: calc(66.666% - 2 * var(--stg-gap) - 64px);
    }
    .ciepm-agenda-season .bringer-detailed-list-description p { text-align: left; hyphens: manual; }
}

/* Accueil, écrans de moins de 1024 px : « création, diffusion et médiation culturelle » (sur une ligne)
   chevauchait les deux autres mentions ; elle passe seule sur sa ligne, les deux autres dessous */
@media only screen and (max-width: 1023px) {
    .ciepm-home-info { flex-wrap: wrap; row-gap: 6px; }
    .ciepm-home-info > div:first-child { width: 100%; }
    .ciepm-home-info > div:first-child,
    .ciepm-home-info > div:first-child a { font-size: min(clamp(14px, 1.3vw, 18px), calc((100vw - 40px) / 20.5)); }
    .ciepm-home-info > div:nth-child(2) { width: 50%; text-align: left; }
    .ciepm-home-info > div:nth-child(3) { width: 50%; text-align: right; }
}

/* En-tête de 961 à 1279 px (iPad paysage, petits portables) : le logo était écrasé (13 px de large)
   et « AVEC LES PUBLICS » passait sur trois lignes ; logo à 64 px, liens un peu plus petits, sur une ligne */
@media only screen and (min-width: 961px) and (max-width: 1279px) {
    #bringer-header .bringer-header-lp { flex-shrink: 0; }
    #bringer-header .bringer-header-lp img { width: 64px; height: 64px; }
    #bringer-header .main-menu { gap: clamp(4px, .8vw, 12px); }
    #bringer-header .main-menu > li > a { white-space: nowrap; font-size: clamp(12.5px, 1.05vw, 16px); }
    #bringer-header .bringer-header-rp .bringer-button { padding-left: 16px; padding-right: 16px; }
}

/* Présentation : encarts « cinéma » panoramiques sous Démarche artistique (l'affiche du film reste entière) */
.ciepm-encarts-larges .ciepm-petite-photo { aspect-ratio: 23 / 10; }
/* les 3 encarts « plateau » sous la citation de Jean Galard : même écart (24 px) au-dessus et au-dessous de la citation */
section.ciepm-encarts-plateau { padding-top: 0; }
.ciepm-encarts-plateau .ciepm-petites-photos { margin-top: 0; }
/* même espace au-dessus de la citation de Jean Galard qu'en dessous (48 px) */
.ciepm-encarts-larges { margin-bottom: 24px; }
/* sur téléphone, le nom n'est pas répété sur l'affiche du film (le titre y est déjà écrit) */
@media (hover: none) { .ciepm-encarts-larges a[href="dismoi.html"] .ciepm-petite-nom { opacity: 0; } }
/* 4 encarts « films » sous la citation de Laurent Gaudé */
section.ciepm-encarts-films { padding-top: 0; }
.ciepm-encarts-films .ciepm-petites-photos { margin-top: 0; }
@media (min-width: 740px) and (max-width: 1024px) { .ciepm-encarts-films .ciepm-petites-photos > div:nth-child(n+3) { margin-top: 16px; } }

/* Présentation : diaporama et grandes photos cliquables vers la page du spectacle, nom et année au survol */
.swiper-slide:has(> .ciepm-photo-lien), .bringer-parallax-media:has(> .ciepm-photo-lien) { position: relative; }
a.ciepm-photo-lien { position: absolute; inset: 0; z-index: 20; border-radius: inherit; overflow: hidden; }
a.ciepm-photo-lien:hover .ciepm-petite-nom, a.ciepm-photo-lien:focus-visible .ciepm-petite-nom { opacity: 1; }
.ciepm-encarts-films .ciepm-encarts-larges { margin-bottom: 0; }
/* rangée « cinéma » (Dis-moi, MOTIFS) en 16:9 : les affiches animées restent entières */
.ciepm-encarts-169 .ciepm-petite-photo { aspect-ratio: 16 / 9; }
/* Démarche artistique : MOTIFS animé seul dans la colonne de droite, sans marge au-dessus */
.ciepm-encart-seul.ciepm-petites-photos { margin-top: 0; }
.ciepm-demarche-row + .ciepm-petites-photos { margin-top: 32px; }
/* Résidences : le titre (largeur ajustée au mot) calé à droite, le long de la photo, comme le texte */
@media (min-width: 1025px) {
    .ciepm-about-row > div:first-child:not(:has(.bringer-parallax-media)) > h2 { margin-left: auto; }
}
/* Démarche artistique : la rangée au-dessus du titre (Dis-moi, LET'S DANCE IN HERISSON) */
.ciepm-encarts-dessus.ciepm-petites-photos { margin-top: 0; }
.ciepm-encarts-dessus.ciepm-petites-photos { margin-bottom: 48px; }
/* 48 px entre la rangée qui précède la citation de Jean Galard et la citation ; rien de plus sous la rangée qui la suit */
.ciepm-encarts-avant-citation.ciepm-petites-photos { margin-bottom: 24px; }
.ciepm-encarts-plateau .ciepm-encarts-larges { margin-bottom: 0; }

/* Accueil : moitié moins d'espace entre les trois photos des rubriques et le bandeau qui défile */
main section:has(+ section .bringer-marquee) { padding-bottom: 64px !important; }
@media only screen and (max-width: 960px) { main section:has(+ section .bringer-marquee) { padding-bottom: 48px !important; } }
@media only screen and (max-width: 739px) { main section:has(+ section .bringer-marquee) { padding-bottom: 40px !important; } }

/* Présentation : listes « ⚹ … » (formes partagées, Séances HYPER) alignées à gauche, sans justification */
.ciepm-text p.ciepm-liste, p.ciepm-liste { text-align: left; hyphens: manual; }

/* Présentation, photos réorganisées (25/10/2026) : même espace sous chaque rangée de photos,
   et 48 px entre la citation de Jean Galard et « Résidences » */
.ciepm-petites-photos.ciepm-encarts-larges { margin-bottom: 0; }
main .ciepm-quote-section:not(.ciepm-quote-serree) + .ciepm-post-section { padding-top: 34px; }
main .ciepm-quote-serree + section { padding-top: 10px !important; }
main section:has(+ .ciepm-quote-serree) .ciepm-petites-photos { margin-top: 48px; }

/* Page Vidéos : visuel agrandi jusqu'à 8 px du bord du carton, sans changer la taille du carton.
   Le carton perd sa marge en haut, à droite et en bas (8 px au lieu de --stg-gap) ; le visuel s'élargit
   d'autant (calcul : même hauteur de carton qu'avant à toutes les largeurs). Vidéo ouverte : inchangée. */
.ciepm-videos-2cols .bringer-toggles-item:not(.is-active) { padding-top: 8px; padding-right: 8px; padding-bottom: 8px; }
.ciepm-videos-2cols .bringer-toggles-item:not(.is-active) .ciepm-vthumb {
    flex-basis: calc(48% + 3.0756 * var(--stg-gap) - 29.94px); width: calc(48% + 3.0756 * var(--stg-gap) - 29.94px);
    border-radius: 10px;
}
.ciepm-videos-2cols .bringer-toggles-item:not(.is-active) .ciepm-vtitle i.bringer-icon { right: calc(48% + 3.0756 * var(--stg-gap) - 15.94px); }
@media (max-width: 600px) {
    .ciepm-videos-2cols .bringer-toggles-item:not(.is-active) .ciepm-vthumb {
        flex-basis: calc(42% + 3.1356 * var(--stg-gap) - 30.42px); width: calc(42% + 3.1356 * var(--stg-gap) - 30.42px);
    }
}

/* Page Vidéos : au survol, le visuel s'agrandit de 20 % et sort un peu du carton, avec une ombre,
   comme les photos des cartes Créations, Films et Avec les publics (ordinateur seulement) */
@media (hover: hover) and (min-width: 1025px) {
    .ciepm-videos-2cols .bringer-toggles-item:not(.is-active) { overflow: visible; position: relative; }
    .ciepm-videos-2cols .bringer-toggles-item:not(.is-active) .ciepm-vthumb {
        position: relative; z-index: 1; transform-origin: center center;
        transition: transform .45s cubic-bezier(.2, .7, .2, 1), box-shadow .45s ease, z-index 0s .45s;
    }
    .ciepm-videos-2cols .bringer-toggles-item:not(.is-active):hover { z-index: 40; }
    .ciepm-videos-2cols .bringer-toggles-item:not(.is-active):hover .ciepm-vthumb {
        transform: scale(1.2); z-index: 40; box-shadow: 0 20px 50px rgba(0, 0, 0, .25);
        transition: transform .45s cubic-bezier(.2, .7, .2, 1), box-shadow .45s ease, z-index 0s 0s;
    }
}
@media (prefers-reduced-motion: reduce) { .ciepm-videos-2cols .bringer-toggles-item:hover .ciepm-vthumb { transform: none; } }
/* Présentation : cadre vide (photo à choisir), même taille que la photo qu'il remplace */
.ciepm-cadre-vide { width: 100%; height: auto; border: 2px dashed #d9c7c3; background: #faf6f5; }
/* Présentation : photo seule, centrée (fin de la biographie) */
.ciepm-petites-photos.ciepm-encart-centre { justify-content: center; }

/* LaDanseAimeLesGens : programmation 2026 (visuel, titre, compagnie) */
.ciepm-programme .ciepm-prog { margin-bottom: 28px; }
.ciepm-prog-titre { margin: 12px 0 0; font-weight: 900; font-size: 18px; line-height: 1.25; text-transform: uppercase; color: var(--bringer-s-heading); }
.ciepm-prog-cie { margin: 2px 0 0; font-size: 14px; line-height: 1.35; }
/* LaDanseAimeLesGens : mosaïque 3 × 3 de la programmation, photos collées, nom en blanc au survol */
.ciepm-mosaique { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0; border-radius: var(--bringer-small-br, 12px); overflow: hidden; }
.ciepm-mosaique-case { position: relative; display: block; aspect-ratio: 1 / 1; overflow: hidden; }
.ciepm-mosaique-case img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform .45s cubic-bezier(.2, .7, .2, 1); }
.ciepm-mosaique-case:hover img { transform: scale(1.05); }
.ciepm-mosaique-case:hover .ciepm-petite-nom, .ciepm-mosaique-case:focus-visible .ciepm-petite-nom { opacity: 1; }
.ciepm-mosaique .ciepm-petite-nom small { font-size: 11px; }
@media (max-width: 600px) { .ciepm-mosaique .ciepm-petite-nom { padding: 24px 8px 8px; } .ciepm-mosaique .ciepm-petite-nom strong { font-size: 12px; } .ciepm-mosaique .ciepm-petite-nom small { font-size: 9px; } }
/* LaDanseAimeLesGens : mosaïque 3 × 3 de la programmation, photos collées, nom en blanc au survol */
.ciepm-mosaique { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0; border-radius: var(--bringer-small-br, 12px); overflow: hidden; }
.ciepm-mosaique-case { position: relative; display: block; aspect-ratio: 1 / 1; overflow: hidden; }
.ciepm-mosaique-case img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform .45s cubic-bezier(.2, .7, .2, 1); }
.ciepm-mosaique-case:hover img { transform: scale(1.05); }
.ciepm-mosaique-case:hover .ciepm-petite-nom, .ciepm-mosaique-case:focus-visible .ciepm-petite-nom { opacity: 1; }
.ciepm-mosaique .ciepm-petite-nom small { font-size: 11px; }
@media (max-width: 600px) { .ciepm-mosaique .ciepm-petite-nom { padding: 24px 8px 8px; } .ciepm-mosaique .ciepm-petite-nom strong { font-size: 12px; } .ciepm-mosaique .ciepm-petite-nom small { font-size: 9px; } }
.ciepm-mosaique-case img { border-radius: 0 !important; }
@media (max-width: 600px) { .ciepm-mosaique .ciepm-petite-nom strong { font-size: 11px; overflow-wrap: anywhere; hyphens: auto; } }

/* Pages à deux grandes cartes (Films, Co-créations) : zoom plus léger au survol (cartes déjà grandes) */
@media (hover: hover) and (min-width: 1025px) {
    .bringer-grid-2cols > .ciepm-card.ciepm-card:hover { transform: translateY(var(--ciepm-dy, 0px)) scale(1.05); }
    .bringer-grid-2cols > .ciepm-card.ciepm-card:hover .bringer-portfolio-card-image { transform: scale(1.08); }
}
p.ciepm-italique { font-style: italic; }

/* Crédits photo en bas de chaque page (build.py : credits_photos ; classe distincte de la fiche technique .ciepm-credits) */
.ciepm-credits-photo { padding-top: 32px; }
.ciepm-credits-photo p { font-size: 13px; line-height: 1.5; opacity: .6; margin: 0; }

/* Accueil : lien vers la présentation, sous le diaporama, centré entre deux filets rose poudré
   terminés par l'étoile ⚹ de la compagnie (« Cie pm » garde son « pm » en minuscules) */
main section.ciepm-lien-presentation { padding-top: 16px; padding-bottom: 0; }
.ciepm-lien-orne { display: flex; align-items: center; justify-content: center; gap: 18px; text-align: center; }
.ciepm-lien-orne::before, .ciepm-lien-orne::after { content: ""; flex: 1 1 0; max-width: 220px; height: 1px; background: var(--bringer-s-text-accent); opacity: .45; }
.ciepm-orne { color: var(--bringer-s-text-accent); font-size: 26px; line-height: 1; flex: none; }
.ciepm-lien-presentation .bringer-arrow-link { text-transform: none; }
@media (max-width: 767px) {
    main section.ciepm-lien-presentation { padding-top: 8px; }
    .ciepm-lien-orne { gap: 10px; }
    .ciepm-lien-orne::before, .ciepm-lien-orne::after { display: none; }
    .ciepm-orne { font-size: 20px; }
    main .ciepm-lien-orne a.bringer-arrow-link { font-size: 18px !important; line-height: 1.35; }
}
.ciepm-nowrap { white-space: nowrap; }

/* ===============
   FICHES TECHNIQUES NORMÉES (build.py : normer_fiches)
   Titre : étoile ⚹ + titre + filet rose poudré ; une entrée par ligne (rôle en petites capitales, noms en gras) ;
   rubrique longue : toute la largeur, 2 colonnes équilibrées ; rubriques courtes : côte à côte.
=============== */
.ciepm-fiche { display: grid; gap: 40px; margin-top: 8px; }
.ciepm-fiche-rang { display: grid; grid-template-columns: 1fr; gap: 40px; }
.ciepm-fiche-rang.is-paire { grid-template-columns: 1fr 1fr; }
.ciepm-credits h5.ciepm-fiche-titre {
    display: flex; align-items: center; gap: 12px;
    font-size: 16px; letter-spacing: .06em; margin: 0 0 18px;
}
.ciepm-credits h5.ciepm-fiche-titre::after {
    content: ""; flex: 1; height: 1px; background: var(--bringer-s-text-accent); opacity: .4;
}
.ciepm-fiche-etoile { color: var(--bringer-s-text-accent); font-size: 20px; line-height: 1; }
.ciepm-fiche-liste { list-style: none; margin: 0; padding: 0; }
.ciepm-credits .ciepm-fiche-liste > li { list-style: none; }
.ciepm-fiche-liste.is-2cols { column-count: 2; column-gap: 48px; column-fill: balance; }
.ciepm-fiche-entree {
    break-inside: avoid; margin: 0 0 12px; padding: 0;
    font-family: var(--bringer-t-content-ff); font-size: 14px; line-height: 1.6;
}
.ciepm-fiche-entree.is-element { margin-bottom: 4px; padding-left: 14px; position: relative; }
.ciepm-fiche-entree.is-element::before {
    content: "–"; position: absolute; left: 0; color: var(--bringer-s-text-accent);
}
.ciepm-fiche-entree.is-role-seul { margin-bottom: 4px; break-after: avoid; }
.ciepm-fiche-entree.is-long { column-span: all; padding-top: 12px; }
.ciepm-fiche-role {
    display: block; font-size: 11px; letter-spacing: .08em; text-transform: uppercase;
    color: var(--bringer-s-text-accent); font-weight: 600; line-height: 1.4; margin-bottom: 2px;
}
.ciepm-fiche-noms { display: block; }
.ciepm-fiche-noms strong { font-weight: 700; }
@media (max-width: 767px) {
    .ciepm-fiche-rang.is-paire { grid-template-columns: 1fr; }
    .ciepm-fiche-liste.is-2cols { column-count: 1; }
}
/* rôle + sa liste (coproduction…) : un bloc, un élément par ligne précédé d'un tiret rose */
.ciepm-credits .ciepm-fiche-sousliste { list-style: none; margin: 0; padding: 0; }
.ciepm-credits .ciepm-fiche-sousliste > li { list-style: none; position: relative; padding-left: 14px; margin: 0 0 4px; }
.ciepm-credits .ciepm-fiche-sousliste > li::before { content: "–"; position: absolute; left: 0; color: var(--bringer-s-text-accent); }
.ciepm-credits .ciepm-fiche-sousliste.is-2cols { column-count: 2; column-gap: 48px; }
.ciepm-credits .ciepm-fiche-sousliste.is-2cols > li { break-inside: avoid; }
@media (max-width: 767px) { .ciepm-credits .ciepm-fiche-sousliste.is-2cols { column-count: 1; } }
.ciepm-fiche-sep { color: var(--bringer-s-text-accent); margin: 0 .25em; }

/* Ligne CRÉATION alignée (demande de la Cie pm, 26/10/2026) : titre dans une colonne de largeur fixe,
   puis un trait vertical rose poudré qui « pose » la date et le lieu ; plusieurs créations (en salle,
   espace public) : dates alignées les unes sous les autres */
.ciepm-creation-line {
    grid-template-columns: 270px 2px minmax(0, 1fr);
    column-gap: 22px;
}
.ciepm-creation-line h5 { grid-column: 1; grid-row: 1; }
.ciepm-creation-line .ciepm-cdate { grid-column: 3; grid-row: 1; }
.ciepm-creation-line .ciepm-cplace { grid-column: 3; grid-row: 2; }
.ciepm-creation-line .ciepm-cstar {
    grid-column: 2; grid-row: 1 / span 2; align-self: stretch; justify-self: stretch;
    font-size: 0; width: 2px; background: var(--bringer-s-text-accent); opacity: .55;
}
@media (max-width: 600px) {
    .ciepm-creation-line { grid-template-columns: 38% 2px minmax(0, 1fr); column-gap: 14px; }
}
/* Ordinateur et grande tablette : CRÉATION | date | lieu sur une seule ligne, dates et lieux alignés d'une ligne à l'autre */
@media (min-width: 1024px) {
    .ciepm-creation-line { grid-template-columns: 270px 2px 190px minmax(0, 1fr); }
    .ciepm-creation-line .ciepm-cstar { grid-row: 1; }
    .ciepm-creation-line .ciepm-cplace { grid-column: 4; grid-row: 1; margin-bottom: 0; }
}
/* Plus de ligne grise sous CRÉATION : le trait vertical rose et les titres de la fiche suffisent */
.ciepm-creation-line { border-bottom: 0; padding-bottom: 8px; }
/* « CRÉATION » aligné à droite, contre le trait vertical */
.ciepm-creation-line h5 { justify-self: end; text-align: right; }
/* Flèche rose entre la date et le lieu de création */
.ciepm-creation-line .ciepm-cdate::after { content: "→"; color: var(--bringer-s-text-accent); margin-left: auto; padding-left: .6em; }
/* Flèche près de la date : colonne de date ajustée à la date ; quand il y a plusieurs créations (GROTESQUE),
   largeur commune pour que dates et flèches restent alignées */
@media (min-width: 1024px) {
    .ciepm-creation-line { grid-template-columns: 270px 2px max-content minmax(0, 1fr); }
    .ciepm-creation-line:has(+ .ciepm-creation-line),
    .ciepm-creation-line + .ciepm-creation-line { grid-template-columns: 270px 2px 190px minmax(0, 1fr); }
}
/* La flèche suit la date (sur une ligne) ; avec plusieurs créations, flèches alignées au bout de la colonne des dates */
.ciepm-creation-line .ciepm-cdate { display: flex; align-items: baseline; white-space: nowrap; }
@media (max-width: 1023px) { .ciepm-creation-line .ciepm-cdate { white-space: normal; } }
@media (max-width: 1023px) { .ciepm-creation-line .ciepm-cdate::after { content: none; } }

/* « Voir les dates » : accordéon sous la ligne CRÉATION (build.py : dates_spectacles) */
.ciepm-dates { margin: 6px 0 36px; border-top: 1px solid var(--bringer-s-border); border-bottom: 1px solid var(--bringer-s-border); }
.ciepm-dates > summary {
    list-style: none; cursor: pointer; display: flex; align-items: baseline; gap: 14px; padding: 14px 0;
}
.ciepm-dates > summary::-webkit-details-marker { display: none; }
.ciepm-dates > summary::before {
    content: "+"; color: var(--bringer-s-text-accent); font-size: 22px; line-height: 1; width: 14px; transition: transform .25s;
}
.ciepm-dates[open] > summary::before { content: "–"; }
.ciepm-dates-titre { font-size: 16px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; }
.ciepm-dates-nb { font-size: 12px; letter-spacing: .06em; text-transform: uppercase; color: var(--bringer-s-text-accent); }
.ciepm-dates > summary:hover .ciepm-dates-titre { color: var(--bringer-s-text-accent); }
.ciepm-dates-contenu { padding: 4px 0 20px 28px; columns: 2; column-gap: 48px; }
.ciepm-dates-saison { break-inside: avoid; margin-bottom: 22px; }
.ciepm-dates-saison h6 { font-size: 13px; letter-spacing: .06em; text-transform: uppercase; margin: 0 0 6px; display: flex; gap: 10px; align-items: center; }
.ciepm-dates-badge { background: var(--bringer-s-accent); color: var(--bringer-s-accented-text); border-radius: 999px; padding: 2px 10px; font-size: 11px; }
.ciepm-dates-lieux, .ciepm-dates-lieux p { font-size: 14px; line-height: 1.6; margin: 0 0 4px; }
.ciepm-dates-agenda { column-span: all; margin: 4px 0 0; font-size: 14px; }
@media (max-width: 767px) { .ciepm-dates-contenu { columns: 1; padding-left: 0; } }
.ciepm-dates-badge { display: none; }
.ciepm-dates-saison.is-a-venir h6 .ciepm-dates-badge,
.ciepm-dates.is-a-venir > summary .ciepm-dates-badge { display: inline-block; }
.ciepm-dates-saison.is-a-venir .ciepm-date.is-passee { opacity: .45; }

/* Fiches techniques en accordéon : le titre (étoile + filet) ouvre la rubrique ; « + » / « – » au bout du filet */
details.ciepm-fiche-rubrique > summary { list-style: none; cursor: pointer; }
details.ciepm-fiche-rubrique > summary::-webkit-details-marker { display: none; }
details.ciepm-fiche-rubrique > summary h5.ciepm-fiche-titre { margin-bottom: 0; padding: 4px 0; }
details.ciepm-fiche-rubrique[open] > summary h5.ciepm-fiche-titre { margin-bottom: 18px; }
.ciepm-fiche-plus { order: 3; color: var(--bringer-s-text-accent); font-size: 22px; line-height: 1; width: 14px; text-align: center; }
.ciepm-fiche-plus::before { content: "+"; }
details.ciepm-fiche-rubrique[open] .ciepm-fiche-plus::before { content: "–"; }
details.ciepm-fiche-rubrique > summary:hover h5.ciepm-fiche-titre { color: var(--bringer-s-text-accent); }
.ciepm-fiche { gap: 22px; }
.ciepm-fiche-rang { gap: 22px 40px; align-items: start; }
/* « Voir les dates » : même dessin que les rubriques de la fiche (étoile, titre, filet, + / –) */
.ciepm-dates { border: 0; margin: 4px 0 22px; }
.ciepm-dates > summary { align-items: center; gap: 12px; padding: 4px 0; }
.ciepm-dates > summary::before { content: none; }
.ciepm-dates-filet { flex: 1; height: 1px; background: var(--bringer-s-text-accent); opacity: .4; }
.ciepm-dates[open] .ciepm-fiche-plus::before { content: "–"; }
.ciepm-dates-contenu { padding: 18px 0 8px; }
/* Accordéons (dates, fiche) : « + » / « – » à gauche, à la place de l'étoile (plus facile à repérer et à toucher) */
details.ciepm-fiche-rubrique > summary .ciepm-fiche-etoile,
details.ciepm-dates > summary .ciepm-fiche-etoile { display: none; }
details.ciepm-fiche-rubrique > summary .ciepm-fiche-plus,
details.ciepm-dates > summary .ciepm-fiche-plus { order: -1; font-weight: 700; }

/* Ligne(s) CRÉATION encadrée(s) : un filet rose au-dessus et en dessous du bloc (une ou plusieurs créations),
   entre le contenu de la page et les accordéons (Voir les dates, fiche) */
section.ciepm-credits > .ciepm-creation-line { padding: 14px 0; margin: 0; }
section.ciepm-credits > .ciepm-creation-line:first-of-type { border-top: 1px solid var(--bringer-s-text-accent); padding-top: 18px; }
section.ciepm-credits > .ciepm-creation-line:not(:has(+ .ciepm-creation-line)) {
    border-bottom: 1px solid var(--bringer-s-text-accent); padding-bottom: 18px; margin-bottom: 18px;
}
section.ciepm-credits > .ciepm-creation-line + .ciepm-creation-line { margin-top: 0; padding-top: 0; }
section.ciepm-credits > .ciepm-creation-line:has(+ .ciepm-creation-line) { padding-bottom: 8px; }

/* Dis-moi : colonne du Linktree élargie (lien sur une ligne), « Disponible en VOD » décalé vers la droite */
@media (min-width: 1200px) {
    section.ciepm-pair .stg-row > div { box-sizing: border-box; }
    section.ciepm-pair .stg-row > div:first-child { flex: 0 0 62%; max-width: 62%; }
    section.ciepm-pair .stg-row > div:last-child { flex: 0 0 38%; max-width: 38%; padding-left: 32px; }
    section.ciepm-pair .stg-row > div:first-child h4 { white-space: nowrap; }
}
/* Revue de presse : citations les unes sous les autres, sans ligne vide entre elles */
.ciepm-press.is-big .ciepm-text p { margin: 0 0 2px; }
/* « Voir les dates » : tout en noir (demande de la Cie pm), dates passées comprises */
.ciepm-dates-contenu, .ciepm-dates-contenu p, .ciepm-dates-contenu .ciepm-date, .ciepm-dates-contenu a:not(.bringer-arrow-link) { color: #141414; }
.ciepm-dates-saison.is-a-venir .ciepm-date.is-passee { opacity: 1; }
/* Textes en italique entre guillemets un peu plus petits (demande de la Cie pm, 26/10/2026) :
   grandes citations (Galard, Gaudé…) − 2 px environ, extraits de presse − 1 px */
blockquote.ciepm-quote p { font-size: clamp(22px, 2.75vw, 33px); }
.ciepm-press .ciepm-text, .ciepm-press .ciepm-text p, .ciepm-press .ciepm-text li { font-size: 13px; }
.ciepm-press.is-big .ciepm-text, .ciepm-press.is-big .ciepm-text p { font-size: 16px; }

/* Audit responsive (26/10/2026) : tailles minimales lisibles sur téléphone */
.ciepm-dates-agenda .bringer-arrow-link { font-size: 13px; }
@media (max-width: 767px) {
    .ciepm-fiche-role { font-size: 12px; }
    .ciepm-mosaique .ciepm-petite-nom small { font-size: 10px; }
}
@media (max-width: 767px) {
    .ciepm-lien-orne a.bringer-arrow-link { min-width: 0; }
    /* les deux morceaux du lien restent entiers : deux lignes nettes */
}
/* Tablette (601–1023 px) : colonne du titre CRÉATION plus étroite, date puis lieu en dessous */
@media (min-width: 601px) and (max-width: 1023px) {
    .ciepm-creation-line { grid-template-columns: 200px 2px minmax(0, 1fr); }
}
/* Téléphone : nom du spectacle sur le diaporama de l'accueil, plus petit et à gauche des flèches (sans être coupé) */
@media (max-width: 767px) {
    .bringer-hero-media-wrap .ciepm-petite-nom { padding-right: 120px; }
    .bringer-hero-media-wrap .ciepm-petite-nom strong { font-size: 13px; line-height: 1.2; white-space: normal; display: block; }
}

/* Présentation, téléphone : rangées de photos en carrousel qu'on fait glisser du doigt
   (une photo à 82 % de la largeur, le bord de la suivante visible, calage automatique) */
@media (max-width: 767px) {
    .ciepm-carrousel-tel {
        display: flex !important; flex-wrap: nowrap !important; gap: 12px;
        overflow-x: auto; overscroll-behavior-x: contain; -webkit-overflow-scrolling: touch;
        scroll-snap-type: x mandatory; scroll-padding-left: 0;
        margin-left: 0; margin-right: -20px; padding-right: 20px;
        scrollbar-width: none;
    }
    .ciepm-carrousel-tel::-webkit-scrollbar { display: none; }
    .ciepm-carrousel-tel > * {
        flex: 0 0 82% !important; max-width: 82% !important; width: 82% !important;
        margin: 0 !important; padding: 0 !important; scroll-snap-align: start;
    }
    .ciepm-carrousel-tel > .ciepm-cadre-vide, .ciepm-carrousel-tel > *:has(> .ciepm-cadre-vide:only-child) { display: none !important; }
}
@media (max-width: 767px) {
    .ciepm-carrousel-tel > * > a, .ciepm-carrousel-tel > * > div { flex: 1 1 100%; width: 100%; min-width: 0; }
    .ciepm-carrousel-tel img { width: 100%; height: auto; }
}
/* Points des carrousels de photos (téléphone seulement) */
.ciepm-carrousel-points { display: none; }
@media (max-width: 767px) {
    .ciepm-carrousel-points { display: block; text-align: center; margin: 16px auto 0 !important; }
    .ciepm-carrousel-points .swiper-pagination-bullet { margin: 0 7px !important; cursor: pointer; }
}

/* Téléphone : encoche « Cie pm » et flèches du diaporama plus petites (accueil, Présentation, pages spectacles),
   pour laisser plus de place à la photo ; le découpage des encoches suit ces tailles */
@media (max-width: 767px) {
    .ciepm-notch-tl { padding: 0 10px 10px 0; }
    .ciepm-notch-tl h1.ciepm-badge-title { height: 40px; font-size: 22px; padding-right: 4px; }
    .bringer-slider-nav.bringer-masked-content { width: 104px; height: 52px; }
    .bringer-slider-nav.bringer-masked-content a { width: 42px; height: 42px; margin: 10px 0 0 10px; }
    .bringer-slider-nav.bringer-masked-content span.bringer-icon { width: 12px; height: 12px; }
}
@media (max-width: 767px) {
    .ciepm-carrousel-points { margin: 18px auto 8px !important; height: auto !important; }
    .ciepm-carrousel-points button.swiper-pagination-bullet {
        width: 20px !important; height: 20px !important; min-width: 0 !important; min-height: 0 !important;
        padding: 0 !important; border: 0 !important; border-radius: 50% !important; margin: 0 9px !important;
        background: var(--bringer-s-heading) !important; opacity: .2; box-shadow: none !important;
    }
    .ciepm-carrousel-points button.swiper-pagination-bullet-active { opacity: 1; }
}

/* ===============
   TÉLÉPHONE UNIQUEMENT (demandes de la Cie pm, 26/10/2026)
=============== */
.ciepm-agenda-tel { display: none; }
@media (max-width: 767px) {
    /* points des carrousels : petits et discrets */
    .ciepm-carrousel-points button.swiper-pagination-bullet { width: 9px !important; height: 9px !important; margin: 0 6px !important; }
    .ciepm-carrousel-points { margin: 14px auto 6px !important; }
    /* flèches sur les côtés du diaporama (pages spectacles) : encoches plus petites */
    .bringer-slider-nav.on-sides { top: calc(50% - 30px); }
    .bringer-slider-nav.on-sides a { width: 38px; height: 60px; }
    .bringer-slider-nav.on-sides a span.bringer-icon { width: 15px; height: 15px; }
    /* cartes des grilles (Créations, Films, Avec les publics) : en couleur, pas de survol au doigt */
    .ciepm-card .bringer-portfolio-card-image img { -webkit-filter: none; filter: none; }
    /* Présentation : une ligne vide avant et après la liste des six axes */
    .ciepm-line:not(.ciepm-axe) + .ciepm-axe { margin-top: 1em; }
    .ciepm-axe + .ciepm-line:not(.ciepm-axe) { margin-top: 1em; }
    /* ligne CRÉATION plus compacte */
    .ciepm-creation-line h5 { font-size: 13px; letter-spacing: .03em; }
    .ciepm-creation-line .ciepm-credit, .ciepm-creation-line .ciepm-credit a { font-size: 14px; line-height: 1.4; }
    section.ciepm-credits > .ciepm-creation-line { grid-template-columns: 34% 2px minmax(0, 1fr); column-gap: 12px; }
    /* accordéons (Voir les dates, Distribution, Production) sur une seule ligne */
    .ciepm-credits h5.ciepm-fiche-titre, .ciepm-dates-titre { font-size: 13px; letter-spacing: .04em; white-space: nowrap; }
    .ciepm-dates > summary { gap: 8px; flex-wrap: nowrap; }
    .ciepm-dates-nb { font-size: 10px; white-space: nowrap; }
    .ciepm-dates-badge { font-size: 10px; padding: 1px 7px; white-space: nowrap; }
    .ciepm-fiche-plus { font-size: 18px; width: 12px; }
}
/* Agenda, téléphone : accordéon « Dates et lieux » sous chaque spectacle (le thème masque la colonne des dates) */
@media (max-width: 739px) {
    .ciepm-agenda-tel { display: block; margin-top: 10px; }
    .ciepm-agenda-tel > summary { list-style: none; cursor: pointer; display: flex; align-items: center; gap: 8px;
        font-size: 12px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--bringer-s-text-accent); }
    .ciepm-agenda-tel > summary::-webkit-details-marker { display: none; }
    .ciepm-agenda-tel[open] .ciepm-fiche-plus::before { content: "–"; }
    .ciepm-agenda-tel-contenu { padding-top: 10px; }
    .ciepm-agenda-tel-contenu, .ciepm-agenda-tel-contenu p { font-size: 14px; line-height: 1.55; color: #141414; text-align: left; margin: 0 0 8px; }
    .bringer-detailed-list li:has(.ciepm-agenda-tel[open]) { align-items: flex-start; }
}
.ciepm-agenda-tel .ciepm-fiche-plus { order: -1; }
@media (max-width: 767px) { .bringer-slider-nav.on-sides { --masked-border-radius: 12px; --masked-inner-radius: 16px; } }

/* ===============
   MODE RESPONSIVE (< 1024 px : téléphones et tablettes), demandes de la Cie pm du 26/10/2026
=============== */
@media (max-width: 1023px) {
    /* Accueil : encoche « Cie pm » et flèches plus petites (le découpage suit ces tailles) */
    .ciepm-notch-tl { padding: 0 10px 10px 0; }
    .ciepm-notch-tl h1.ciepm-badge-title { height: 40px; font-size: 22px; padding-right: 4px; }
    /* Accueil et Présentation : flèches en bas à droite */
    .bringer-slider-nav.bringer-masked-content { width: 100px; height: 50px; }
    .bringer-slider-nav.bringer-masked-content a { width: 40px; height: 40px; margin: 10px 0 0 10px; }
    .bringer-slider-nav.bringer-masked-content span.bringer-icon { width: 12px; height: 12px; }
    /* Pages projets : flèches sur les côtés ; encoche = rayon (12) + rayon intérieur (24) de large,
       2 × 24 de haut : la flèche est centrée dans sa découpe */
    .bringer-slider-nav.on-sides { --masked-border-radius: 12px; --masked-inner-radius: 24px; top: calc(50% - 24px); }
    .bringer-slider-nav.on-sides a { width: 36px; height: 48px; }
    .bringer-slider-nav.on-sides a span.bringer-icon { width: 14px; height: 14px; }
    .bringer-slider-nav.on-sides a.bringer-slider-prev span.bringer-icon,
    .bringer-slider-nav.on-sides a.bringer-slider-next span.bringer-icon { transform: none; }
    /* Pages projets, bas de page : projet précédent / suivant et lien de rubrique plus petits, plus d'air */
    .ciepm-post-nav .bringer-next-post h2 { font-size: 24px; }
    .ciepm-post-nav .bringer-next-post h6 { font-size: 14px; }
    .ciepm-post-nav .bringer-next-post .bringer-icon-wrap { width: 72px; height: 72px; }
    a.bringer-arrow-link.ciepm-back-link { font-size: 17px; }
    section.ciepm-post-nav-section .align-center:has(> .ciepm-back-link),
    section.ciepm-post-nav-section > div:has(.ciepm-back-link):not(.ciepm-post-nav) { margin-top: 36px; }
}
/* Agenda : l'accordéon passe au-dessus du lien qui couvre toute la ligne */
.ciepm-agenda-tel { position: relative; z-index: 6; }
.ciepm-agenda-tel a { position: relative !important; z-index: 7; display: inline !important; }
/* Présentation, mode responsive : la photo de « Cie pm – chorégraphe… » passe sous « Ce travail s'inscrit… »,
   celle des Créations sous la liste des créations (juste avant Démarche artistique) */
@media (max-width: 1023px) {
    .ciepm-about-row.stg-tp-column-reverse { flex-direction: column; }
    .ciepm-about-row > .stg-col-6:has(> .bringer-parallax-media):first-child { order: 2; }
    .ciepm-about-row.stg-tp-column-reverse > .stg-col-6:has(> .bringer-parallax-media),
    .ciepm-about-row > .stg-col-6:has(> .bringer-parallax-media):first-child { margin-top: var(--stg-gap, 32px); margin-bottom: 0; }
}