/* custom/css/pages/blog-category.css */
@layer site.sur-mesure {
/* Généré par docs/tools/themes-portfolios/theme-depart.php : feuille de la page « blog-category » (/blog/category/…), chargée après main.css.
   Importe les composants de la page dans l'ordre du mode commun (un composant partagé par plusieurs pages est un seul fichier). */

/* custom/css/components/modules/blog/blog.css */
/* Généré par docs/tools/themes-portfolios/theme-depart.php : copie de modules/blog/blog.css (tronc).
   Ce fichier est à vous : redessinez-le. */
@layer elements {
/* Version: 09-10-2026-card-ink */
@layer general {
.pf-c-cards--articles {
    width: 100%;
    margin: 0 auto;
    display: grid;
    grid-template-rows: auto;
    /* Écart réglé par la densité des articles (design/elements/options.css, --layout-gap du conteneur). */
    grid-gap: var(--layout-gap, 20px);
}
}

/* Vignettes blog — typo et métadonnées (variables thème portfolio) */
.pf-c-page main .pf-c-cards__item--list .pf-c-card__body,
.pf-c-page main .pf-c-card--tile .pf-c-card__body {
    gap: 0.65rem;
}

.pf-c-page main .pf-c-cards__item--list .pf-c-card__title,
.pf-c-page main .pf-c-card--tile .pf-c-card__title {
    font-size: var(--pf-heading-secondary-size, 14px);
    line-height: var(--pf-heading-secondary-line-height, calc(var(--pf-heading-secondary-size, 14px) + 10px));
    font-weight: bold;
    color: var(--pf-card-title, var(--pf-content-title-color, var(--pf-heading-primary-color, var(--pf-text-main-color, inherit))));
    margin: 0;
    padding: 0;
    text-align: inherit;
}

.pf-c-page main .pf-c-cards__item--list .pf-c-card__meta,
.pf-c-page main .pf-c-card--tile .pf-c-card__meta {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5rem;
    margin: 0;
    /* Taille : structure/layout/reading.css (couche « typo ») l'impose sur toutes les listes ; ici la valeur de base. */
    font-size: var(--pf-font-size-meta);
    line-height: calc(0.75rem + 8px);
    color: var(--pf-heading-secondary-color, var(--pf-text-main-color, inherit));
    opacity: 0.9;
}

.pf-c-page main .pf-c-cards__item--list .pf-c-card__date,
.pf-c-page main .pf-c-card--tile .pf-c-card__date {
    font-style: normal;
    letter-spacing: 0.02em;
}

.pf-c-page main .pf-c-cards__item--list .pf-c-card__category,
.pf-c-page main .pf-c-card--tile .pf-c-card__category {
    /* Pastille : même réglage /theme que « Populaire » et les dates (Pastilles, design/matrices/base.css). */
    --pf-badge-base: var(--pf-button-background-color, #222);
    --pf-badge-base-on: var(--pf-button-text-color, #fff);
    display: inline-block;
    padding: calc(0.12em * var(--pf-badge-pad, 1)) calc(0.55em * var(--pf-badge-pad, 1));
    border-radius: var(--pf-badge-radius, var(--pf-button-radius, var(--pf-border-radius-custom, 4px)));
    background: var(--pf-badge-bg);
    color: var(--pf-badge-ink);
    border: none;
    box-shadow: inset 0 0 0 1px var(--pf-badge-line);
    font-family: var(--pf-button-font-family, inherit);
    /* Lisibilité : 12 px au minimum (un thème peut le régler par --pf-c-card-category-size). */
    font-size: var(--pf-c-card-category-size, max(var(--pf-font-size-small), 12px));
    line-height: calc(0.68rem + 6px);
    letter-spacing: var(--pf-button-letter-spacing, 0.04em);
    text-transform: var(--pf-button-text-transform, none);
    font-weight: var(--pf-button-font-weight, 600);
}

.pf-c-page main .pf-c-cards__item--list .pf-c-card__excerpt,
.pf-c-page main .pf-c-card--tile .pf-c-card__excerpt {
    flex: 1;
    margin: 0;
    font-size: calc(var(--pf-font-size-base, 14px) * 0.875);
    line-height: calc(var(--pf-text-line-height) * 0.875);
    color: var(--pf-text-main-color, inherit);
    opacity: 0.92;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
}

/* Colonnes de la liste des articles (pages Blog et catégorie) : autrefois pf-cols-4 pf-cols-lg-3 pf-cols-md-2 pf-cols-sm-1
   dans le HTML ; même couche (socle) et même spécificité que core/layout.css. */
@layer socle {
@layer general {
:where(body[data-pf-page="blog"], body[data-pf-page="blog-category"]) .pf-c-cards--articles {
  --cols-lg: 3;
  --cols-md: 2;
  --cols-sm: 1;
  display: grid;
  grid-template-rows: auto;
  gap: var(--layout-gap);
  --cols: 4;
  --cols-lg-auto: 3;
}
}

:where(body[data-pf-page="blog"], body[data-pf-page="blog-category"]) .pf-c-page .pf-c-cards--articles {
  --_cols: var(--cols);
  grid-template-columns: repeat(var(--_cols), 1fr);
}

@media screen and (min-width: 1101px) and (max-width: 1439px) {
  :where(body[data-pf-page="blog"], body[data-pf-page="blog-category"]) .pf-c-page .pf-c-cards--articles {
    --_cols: var(--cols-lg, var(--cols-lg-auto));
  }
}

@media screen and (max-width: 1100px) {
  :where(body[data-pf-page="blog"], body[data-pf-page="blog-category"]) .pf-c-page .pf-c-cards--articles {
    --_cols: var(--cols-md, var(--cols));
  }
}

@media screen and (max-width: 650px) {
  :where(body[data-pf-page="blog"], body[data-pf-page="blog-category"]) .pf-c-page .pf-c-cards--articles {
    --_cols: var(--cols-sm, var(--cols-md, var(--cols)));
  }
}

@media screen and (min-width: 1440px) {
  :where(body[data-pf-page="blog"], body[data-pf-page="blog-category"]) .pf-c-page .pf-c-cards--articles:is(.pf-w-content, [data-pf-width="content"], .pf-c-consent-prefs, :is(.pf-w-content, [data-pf-width="content"], .pf-c-consent-prefs) *) {
    --_cols: var(--cols-lg, var(--cols-lg-auto));
  }
}
}



/* custom/css/structure/layout/content.css */
/* Généré par docs/tools/themes-portfolios/theme-depart.php : copie de structure/layout/content.css (tronc).
   Ce fichier est à vous : redessinez-le. */
@layer socle.general {
/* Version: 20-09-2026-16-46 */
/* Version: 04-09-2026-content-align */
/*
 * Contenu riche Arktefakt — public + éditeur Writer.
 * Contrat HTML : blocs Writer (serialize.js) + sanitize writer.php.
 * Variables : --pf-font-size-base, --pf-heading-* (thème portfolio).
 * Les fallbacks gardent un rendu lisible hors thème portfolio (hub Writer, register CGV).
 */

/* --------------------------------------------------------------------------
   Conteneur
   -------------------------------------------------------------------------- */

.pf-c-prose {
    font-size: var(--pf-font-size-base, 14px);
    line-height: var(--pf-text-line-height, calc(var(--pf-font-size-base, 14px) + 10px));
    letter-spacing: 0.4px;
    font-weight: inherit;
    color: inherit;
    --pf-content-link-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M14 3h7v7h-2V6.41l-9.29 9.3-1.42-1.42 9.3-9.29H14V3z'/%3E%3C/svg%3E");
    --pf-content-link-padding-y: 0.15em;
    --pf-content-link-padding-x: 0.42em;
}

.pf-c-prose :is(.pf-c-article__subtitle, .pf-c-gate__label, .pf-c-error__code, .pf-c-error__subtitle),
.pf-c-prose :is(.pf-c-article__subtitle, .pf-c-gate__label, .pf-c-error__code, .pf-c-error__subtitle) p {
    margin: 20px 0;
    font-weight: bold;
}

/* --------------------------------------------------------------------------
   Paragraphes et variantes
   -------------------------------------------------------------------------- */

.pf-c-prose p {
    margin-bottom: 25px;
}

.pf-c-prose p.description,
.pf-c-prose .writer-editable.description {
    font-size: calc(var(--pf-font-size-base, 14px) * 1.05);
    line-height: 1.55;
    color: inherit;
    opacity: 0.92;
}

.pf-c-prose p.commentaire,
.pf-c-prose .writer-editable.commentaire {
    font-size: calc(var(--pf-font-size-base, 14px) * 0.95);
    line-height: 1.5;
    font-style: italic;
    color: inherit;
    opacity: 0.85;
    padding-left: 0.5rem;
    border-left: 2px solid color-mix(in srgb, currentColor 25%, transparent);
}

.pf-c-prose u {
    text-decoration: underline;
}

/* Gras et italique (reset + fonts.css annulent les styles navigateur par défaut) */
.pf-c-prose :is(strong, b),
.pf-c-prose .writer-editable :is(strong, b) {
    font-weight: var(--pf-font-weight-bold, 700);
}

.pf-c-prose :is(em, i),
.pf-c-prose .writer-editable :is(em, i) {
    font-style: italic;
}

/* Tableau (bloc Writer) : défile horizontalement s’il est plus large que le contenu.
   contain: inline-size : sa largeur ne remonte pas aux parents ; sans cela, dans une
   colonne de grille / flex sans min-width: 0, le tableau élargit la colonne au lieu
   de défiler et le bord droit est coupé sur mobile. */
.pf-c-prose .writer-table {
    max-width: 100%;
    margin: 1.2em 0;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    contain: inline-size;
}

.pf-c-prose .writer-table table {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.95em;
}

.pf-c-prose .writer-table caption {
    caption-side: bottom;
    padding-top: 0.5em;
    font-size: 0.85em;
    text-align: left;
    opacity: 0.75;
}

.pf-c-prose .writer-table :is(th, td) {
    padding: 0.5em 0.75em;
    border-bottom: 1px solid color-mix(in srgb, currentColor 18%, transparent);
    text-align: left;
    vertical-align: top;
}

.pf-c-prose .writer-table th {
    font-weight: var(--pf-font-weight-bold, 700);
    border-bottom-width: 2px;
}

.pf-c-prose .writer-table :is(th, td).writer-align-center {
    text-align: center;
}

.pf-c-prose .writer-table :is(th, td).writer-align-right {
    text-align: right;
}

/* Code en ligne (Markdown `code`, collage) : police à chasse fixe, fond léger. */
.pf-c-prose code,
.pf-c-prose .writer-editable code {
    padding: 0.1em 0.3em;
    border-radius: 3px;
    background: color-mix(in srgb, currentColor 8%, transparent);
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
    font-size: 0.9em;
}

/* --------------------------------------------------------------------------
   Titres dans le corps (hors titres de page)
   -------------------------------------------------------------------------- */

.pf-c-prose h1 {
    font-size: var(--pf-heading-primary-size, 21px);
    line-height: var(--pf-heading-primary-line-height, calc(var(--pf-heading-primary-size, 21px) + 2px));
    font-weight: bold;
    color: var(--pf-heading-primary-color, inherit);
    display: block;
    padding: 0;
    margin: 0 0 0.75rem;
}

.pf-c-prose h1 :is(a, span, p, strong, em, b, i, small) {
    color: inherit;
}

.pf-c-prose :is(h2, h3, h4, h5, h6) {
    font-size: var(--pf-heading-secondary-size, 14px);
    line-height: var(--pf-heading-secondary-line-height, calc(var(--pf-heading-secondary-size, 14px) + 10px));
    font-weight: bold;
    color: var(--pf-heading-secondary-color, inherit);
}

.pf-c-prose h2 {
    margin: 45px 0 0.65rem;
}

.pf-c-prose h3 {
    margin: 25px 0 0.65rem;
}

.pf-c-prose :is(h4, h5, h6) {
    margin: 0 0 0.65rem;
}

.pf-c-prose :is(h2, h3, h4, h5, h6) :is(a, span, p, strong, em, b, i, small) {
    color: inherit;
}

/* --------------------------------------------------------------------------
   Alignement et décalage (Writer)
   -------------------------------------------------------------------------- */

.pf-c-prose p.writer-align-center,
.pf-c-prose blockquote p.writer-align-center {
    text-align: center;
}

.pf-c-prose p.writer-align-right,
.pf-c-prose blockquote p.writer-align-right {
    text-align: right;
}

.pf-c-prose p.writer-align-justify,
.pf-c-prose blockquote p.writer-align-justify {
    text-align: justify;
}

.pf-c-prose p.writer-indent-1,
.pf-c-prose blockquote p.writer-indent-1 { margin-left: 1.25rem; }
.pf-c-prose p.writer-indent-2,
.pf-c-prose blockquote p.writer-indent-2 { margin-left: 2.5rem; }
.pf-c-prose p.writer-indent-3,
.pf-c-prose blockquote p.writer-indent-3 { margin-left: 3.75rem; }
.pf-c-prose p.writer-indent-4,
.pf-c-prose blockquote p.writer-indent-4 { margin-left: 5rem; }
.pf-c-prose p.writer-indent-5,
.pf-c-prose blockquote p.writer-indent-5 { margin-left: 6.25rem; }

/* Éditeur Writer : classes sur .writer-editable (div), pas seulement p */
.pf-c-prose .writer-editable.writer-align-center {
    text-align: center;
}

.pf-c-prose .writer-editable.writer-align-right {
    text-align: right;
}

.pf-c-prose .writer-editable.writer-align-justify {
    text-align: justify;
}

.pf-c-prose .writer-editable.writer-indent-1 { margin-left: 1.25rem; }
.pf-c-prose .writer-editable.writer-indent-2 { margin-left: 2.5rem; }
.pf-c-prose .writer-editable.writer-indent-3 { margin-left: 3.75rem; }
.pf-c-prose .writer-editable.writer-indent-4 { margin-left: 5rem; }
.pf-c-prose .writer-editable.writer-indent-5 { margin-left: 6.25rem; }

/* --------------------------------------------------------------------------
   Mise en page (Writer)
   -------------------------------------------------------------------------- */

.pf-c-prose hr.writer-separator,
.writer-editor.pf-c-prose hr.writer-separator {
    display: block;
    width: 100%;
    height: 0;
    margin: 1.5rem 0;
    padding: 0;
    border: none;
    border-top: 1px solid var(--pf-color-border, color-mix(in srgb, currentColor 22%, transparent));
    border-top-color: color-mix(
        in srgb,
        var(--pf-button-background-color, var(--pf-heading-secondary-color, currentColor)) 55%,
        var(--pf-color-border-custom, var(--pf-color-border, currentColor)) 45%
    );
    background: transparent;
    opacity: 0.9;
}

.pf-c-prose .writer-spacer {
    display: block;
    width: 100%;
    height: 10px;
    margin: 0;
    padding: 0;
    border: none;
    background: transparent;
}

.pf-c-prose .writer-columns {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1.5rem;
    width: 100%;
    margin: 1rem 0;
}

.pf-c-prose .writer-column {
    min-width: 0;
}

.pf-c-prose .writer-column > :first-child {
    margin-top: 0;
}

.pf-c-prose .writer-column > :last-child {
    margin-bottom: 0;
}

@media (max-width: 768px) {
    .pf-c-prose .writer-columns {
        grid-template-columns: 1fr;
        gap: 1rem;
    }
}

/* --------------------------------------------------------------------------
   Citations
   -------------------------------------------------------------------------- */

.pf-c-page .pf-c-prose blockquote,
.pf-c-page .pf-c-prose blockquote :is(p, span, cite, em, strong, b, i, li) {
    color: var(--pf-body-text-color, var(--pf-text-main-color, inherit));
}

.pf-c-prose blockquote {
    position: relative;
    padding: 50px;
    margin-top: 30px;
    margin-bottom: 20px;
}

.pf-c-prose blockquote * {
    margin: 0;
    font-weight: bold;
}

.pf-c-prose blockquote::before {
    position: absolute;
    content: '❝';
    font-size: 60px;
    left: 0;
    top: 0;
}

.pf-c-prose blockquote::after {
    position: absolute;
    content: '❞';
    font-size: 60px;
    right: 0;
    bottom: 0;
}

/* --------------------------------------------------------------------------
   Listes
   -------------------------------------------------------------------------- */

/* Fil d'Ariane (nav.ariane) dans une zone de texte : hors des listes éditoriales, il garde le style du thème
   (:where = sans changer la priorité de ces règles). */
.pf-c-prose ul:where(:not(nav.pf-c-breadcrumb *)),
.pf-c-prose ol:where(:not(nav.pf-c-breadcrumb *)) {
    margin-bottom: 25px;
}

.pf-c-prose ul li:where(:not(nav.pf-c-breadcrumb *)),
.pf-c-prose ol li:where(:not(nav.pf-c-breadcrumb *)) {
    margin-left: 15px;
    padding-left: 15px;
    margin-bottom: 20px;
    line-height: calc(1em + 15px);
}

.pf-c-prose ul li:where(:not(nav.pf-c-breadcrumb *)) {
    list-style-type: disc;
}

.pf-c-prose ol li:where(:not(nav.pf-c-breadcrumb *)) {
    list-style-type: decimal;
}

/* --------------------------------------------------------------------------
   Figures et médias intégrés
   -------------------------------------------------------------------------- */

.pf-c-prose .writer-figure {
    display: flex;
    flex-direction: column;
    gap: var(--layout-space-y-sm, 15px);
    margin: var(--layout-space-y-md, 25px) 0 var(--layout-space-y-lg, 45px);
}

.pf-c-prose .writer-figure img {
    display: block;
    max-width: 100%;
    height: auto;
    border-radius: var(--pf-thumbnail-radius, 0);
}

.pf-c-prose .writer-figure > :is(.youtube, .vimeo, .dailymotion, .tiktok, .instagram, .facebook) {
    margin-bottom: 0;
}

/* Légende : 1re ligne / gras = titre, reste = description. */
.pf-c-prose .writer-figure figcaption {
    max-width: 65ch;
    padding-left: var(--layout-space-x-sm, 10px);
    border-left: 1px solid color-mix(in srgb, currentColor 25%, transparent);
    font-size: calc(var(--pf-font-size-base, 14px) * 0.9);
    line-height: 1.55;
    opacity: 0.78;
}

.pf-c-prose .writer-figure figcaption :is(strong, b) {
    display: block;
    margin-bottom: calc(var(--layout-space-y-sm, 15px) / 5);
    font-size: 1.08em;
    font-weight: 500;
    opacity: 1;
}

.pf-c-prose .writer-figure figcaption:empty {
    display: none;
}

.pf-c-prose .youtube,
.pf-c-prose .vimeo,
.pf-c-prose .dailymotion,
.pf-c-prose .tiktok,
.pf-c-prose .instagram,
.pf-c-prose .facebook {
    max-width: 100%;
    box-sizing: border-box;
    margin-bottom: 1.5rem;
}

.pf-c-prose .youtube:not(.video-portrait),
.pf-c-prose .vimeo,
.pf-c-prose .dailymotion,
.pf-c-prose .facebook:not(.video-portrait) {
    position: relative;
    height: 0;
    overflow: hidden;
    padding-top: 0;
    padding-bottom: 56.25%;
}

.pf-c-prose .vimeo {
    padding-bottom: 56.25%;
}

.pf-c-prose .youtube:not(.video-portrait) iframe,
.pf-c-prose .vimeo iframe,
.pf-c-prose .dailymotion iframe,
.pf-c-prose .facebook:not(.video-portrait) iframe {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    border: 0;
}

.pf-c-prose :is(.tiktok, .tiktok.video-portrait, .instagram, .instagram.video-portrait, .youtube.video-portrait, .facebook.video-portrait) {
    position: relative;
    width: 100%;
    max-width: 100%;
    min-width: 0;
    aspect-ratio: 9 / 16;
    height: auto;
    padding: 0;
    overflow: hidden;
}

.pf-c-prose :is(.tiktok, .instagram, .youtube.video-portrait, .facebook.video-portrait) iframe {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    border: 0;
}

@media screen and (max-width: 700px) {

    .pf-c-prose :is(.tiktok, .instagram, .youtube.video-portrait, .facebook.video-portrait) {
        max-height: 85svh;
    }

}

.pf-c-prose .youtube iframe,
.pf-c-prose .dailymotion iframe,
.pf-c-prose iframe,
.pf-c-prose video,
.pf-c-prose embed,
.pf-c-prose object {
    max-width: 100%;
    box-sizing: border-box;
}

.pf-c-prose video {
    height: auto;
}

.pf-c-page .pf-c-prose :is(.youtube, .vimeo, .dailymotion, .tiktok, .instagram, .facebook):hover,
.pf-c-page .pf-c-prose :is(.youtube, .vimeo, .dailymotion, .tiktok, .instagram, .facebook):active,
.pf-c-page .pf-c-article__media:is(.youtube, .vimeo, .dailymotion, .tiktok, .instagram, .facebook):hover,
.pf-c-page .pf-c-article__media :is(.youtube, .vimeo, .dailymotion, .tiktok, .instagram, .facebook):hover,
.pf-c-page .pf-c-article__media:is(.youtube, .vimeo, .dailymotion, .tiktok, .instagram, .facebook):active,
.pf-c-page .pf-c-article__media :is(.youtube, .vimeo, .dailymotion, .tiktok, .instagram, .facebook):active {
    filter: none;
    transform: none;
    transition: none;
}

/* --------------------------------------------------------------------------
   Liens dans le corps : icône (soulignement et couleur : reading.css, couche lecture)
   -------------------------------------------------------------------------- */

.pf-c-prose a:not(:is(h1 a, h2 a, h3 a, h4 a, h5 a, h6 a)):where(:not(nav.pf-c-breadcrumb *))::after,
.pf-c-prose p a:not(:is(h1 a, h2 a, h3 a, h4 a, h5 a, h6 a))::after,
.pf-c-article__lead:where(.pf-c-prose) a::after,
.pf-c-article__lead:where(.pf-c-prose) p a::after {
    content: "";
    display: inline-block;
    width: 0.8em;
    height: 0.8em;
    margin-left: 0.12em;
    vertical-align: -0.05em;
    background-color: currentColor;
    -webkit-mask: var(--pf-content-link-icon) no-repeat center / contain;
    mask: var(--pf-content-link-icon) no-repeat center / contain;
    text-decoration: none;
    pointer-events: none;
}

/* Hub Writer : priorité sur fonts.css (p, a { font-size: var(--pf-font-size-base) !important }
/* Placeholder éditeur (zones contenteditable vides) */
.writer-editor.pf-c-prose .writer-editable:empty::before {
    content: attr(data-placeholder);
    color: var(--writer-ui-muted, rgba(128, 128, 128, 0.75));
    pointer-events: none;
}

/* --------------------------------------------------------------------------
   Images — largeur conteneur par contexte de page
   -------------------------------------------------------------------------- */

.pf-c-page .pf-c-prose img,
.pf-c-page .pf-c-article__lead img:where(.pf-c-article__cover),
.pf-c-page .pf-c-article__body:where(.pf-c-prose) img,
.pf-c-page .pf-c-article__main img:where(.pf-c-article__cover) {
    max-width: 100%;
    height: auto;
    box-sizing: border-box;
    filter: none;
    transform: none;
    transition: none;
}

.pf-c-page .pf-c-prose img:hover,
.pf-c-page .pf-c-article__lead img:where(.pf-c-article__cover):hover,
.pf-c-page .pf-c-article__body:where(.pf-c-prose) img:hover,
.pf-c-page .pf-c-article__main img:where(.pf-c-article__cover):hover,
.pf-c-page .pf-c-prose img:active,
.pf-c-page .pf-c-article__lead img:where(.pf-c-article__cover):active,
.pf-c-page .pf-c-article__body:where(.pf-c-prose) img:active,
.pf-c-page .pf-c-article__main img:where(.pf-c-article__cover):active {
    filter: none;
    transform: none;
    transition: none;
}

/*
 * Fiches de contenu — bloc « A propos » (#about-content), rendu par
 * includes/structure/about_card.php : titre → .about-card → .about-card-socials.
 * Le conteneur .about-content porte about-align-left|center|right et pilote toute la pile :
 *  - gauche / droite : portrait à côté du texte (miroir à droite) ;
 *  - centre : portrait au-dessus du texte, tout centré.
 * La carte est plafonnée à la largeur de lecture pour ne pas s'étaler en pleine largeur.
 */
.pf-c-page .pf-c-author--card .pf-c-author__row {
    display: flex;
    align-items: center;
    gap: 24px;
    max-width: var(--layout-width-read);
    margin-bottom: 24px;
}

.pf-c-page .pf-c-author--card .pf-c-author__row .pf-c-avatar {
    flex: 0 0 auto;
    margin: 0;
}

.pf-c-page .pf-c-author--card .pf-c-author__body {
    flex: 1 1 auto;
    min-width: 0;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 12px;
}

.pf-c-page .pf-c-author--card .pf-c-author__body > * {
    margin: 0;
}

.pf-c-page .pf-c-author--card .pf-c-author__socials .pf-c-socials {
    margin-bottom: 0;
    justify-content: flex-start;
}

/* Droite : miroir de la gauche. */
.pf-c-page .pf-c-author--card [data-pf-align="right"]:where(:not(.pf-c-header, .pf-c-footer, .pf-c-legal, .pf-c-services__list)) .pf-c-author__row {
    flex-direction: row-reverse;
    margin-left: auto;
    text-align: right;
}

.pf-c-page .pf-c-author--card [data-pf-align="right"]:where(:not(.pf-c-header, .pf-c-footer, .pf-c-legal, .pf-c-services__list)) .pf-c-author__body {
    align-items: flex-end;
}

.pf-c-page .pf-c-author--card [data-pf-align="right"]:where(:not(.pf-c-header, .pf-c-footer, .pf-c-legal, .pf-c-services__list)) .pf-c-author__socials .pf-c-socials {
    justify-content: flex-end;
}

/* Centre : pile verticale centrée. */
.pf-c-page .pf-c-author--card [data-pf-align="center"]:where(:not(.pf-c-header, .pf-c-footer, .pf-c-legal, .pf-c-services__list)) .pf-c-author__row {
    flex-direction: column;
    margin-inline: auto;
    text-align: center;
}

.pf-c-page .pf-c-author--card [data-pf-align="center"]:where(:not(.pf-c-header, .pf-c-footer, .pf-c-legal, .pf-c-services__list)) .pf-c-author__body {
    align-items: center;
}

.pf-c-page .pf-c-author--card [data-pf-align="center"]:where(:not(.pf-c-header, .pf-c-footer, .pf-c-legal, .pf-c-services__list)) .pf-c-author__socials .pf-c-socials {
    justify-content: center;
}

/* Petit écran : pile verticale quel que soit l'alignement. */
@media screen and (max-width: 700px) {
    .pf-c-page .pf-c-author--card .pf-c-author__row,
    .pf-c-page .pf-c-author--card [data-pf-align="right"]:where(:not(.pf-c-header, .pf-c-footer, .pf-c-legal, .pf-c-services__list)) .pf-c-author__row {
        flex-direction: column;
        align-items: flex-start;
    }

    .pf-c-page .pf-c-author--card [data-pf-align="center"]:where(:not(.pf-c-header, .pf-c-footer, .pf-c-legal, .pf-c-services__list)) .pf-c-author__row {
        align-items: center;
    }

    .pf-c-page .pf-c-author--card [data-pf-align="right"]:where(:not(.pf-c-header, .pf-c-footer, .pf-c-legal, .pf-c-services__list)) .pf-c-author__row {
        align-items: flex-end;
    }
}

}

/* Fusion : règles du site pour ce composant (venues de components/site/article.css) */
@media screen and (max-width: 900px) {
  .pf-c-page .pf-c-article__aside {
      gap: 0;
      width: 100%;
      max-width: 100%;
      min-width: 0;
    }
}

@media screen and (max-width: 900px) {
  .pf-c-page .pf-c-article__aside > article.pf-c-article__aside-about {
      width: 100%;
      max-width: 100%;
      margin: 25px 0 0;
    }
}

@media screen and (max-width: 900px) {
  .pf-c-page .pf-c-article__aside > article.pf-c-article__aside-about .pf-c-socials {
      justify-content: center;
    }
}

@media screen and (max-width: 900px) {
  .pf-c-page .pf-c-article__aside > .pf-c-article__aside-block {
      margin-top: 45px;
    }
}

/* Illustration de une + images dans le corps */
.pf-c-page .pf-c-article__main :is(
  .pf-c-article__cover,
  .pf-c-article__body img,
  .pf-c-article__lead img:not(.pf-c-avatar),
  .pf-c-prose .writer-figure img
) {
  border-radius: var(--pfcustom-radius-card);
  border-width: var(--pf-thumbnail-border-width);
  border-style: var(--pf-thumbnail-border-type);
  border-color: var(--pf-thumbnail-border-color);
  box-shadow: var(--pf-thumbnail-box-shadow);
  box-sizing: border-box;
  background-color: var(--pf-theme-bg-alt, var(--pfcustom-bg-elevated));
}

/* Vidéos et cartes média */
.pf-c-page .pf-c-article__main .pf-c-article__media :is(.youtube, .vimeo, .dailymotion, a.pf-c-link-card) {
  border-radius: var(--pfcustom-radius-card);
  border-width: var(--pf-thumbnail-border-width);
  border-style: var(--pf-thumbnail-border-type);
  border-color: var(--pf-thumbnail-border-color);
  box-shadow: var(--pf-thumbnail-box-shadow);
  box-sizing: border-box;
  overflow: hidden;
}

/* --- Profils « À propos » (aside de l'article) ---
 * Même carte que l'encart À propos des fiches (#about-content, components.css), contenu centré.
 * Markup tronc : .pf-cols-1 > [img.about-artist-img] + div (titre, sous-titre, bouton), un
 * couple par profil (plusieurs profils possibles), puis la liste des réseaux.
 */
.pf-c-page .pf-c-article__aside > article.pf-c-article__aside-about {
  box-sizing: border-box;
  gap: 1.25rem;
  padding: clamp(1.25rem, 3vw, 1.85rem);
  background: var(--pfcustom-glass-sheen), var(--pfcustom-card-bg);
  border: var(--pfcustom-page-border);
  border-radius: var(--pfcustom-radius-card);
  box-shadow: 0 8px 28px var(--pfcustom-rgba-black-35-shadow);
  text-align: center;
}

.pf-c-page .pf-c-article__aside > article.pf-c-article__aside-about > .pf-c-author__row {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.85rem;
  width: 100%;
  text-align: center;
}

.pf-c-page .pf-c-article__aside > article.pf-c-article__aside-about > .pf-c-author__row > div > :is(h2.pf-c-author__name, p) {
  margin: 0;
  overflow-wrap: anywhere;
}

.pf-c-page .pf-c-article__aside > article.pf-c-article__aside-about > .pf-c-author__row > div > :is(a.pf-c-btn, a.pf-c-btn) {
  margin-top: 0.6rem;
}

/* Réseaux sous les profils : séparés par un filet */
.pf-c-page .pf-c-article__aside > article.pf-c-article__aside-about > .pf-c-author__row + ul.pf-c-socials {
  width: 100%;
  margin: 0;
  padding-top: 1.25rem;
  border-top: var(--pfcustom-border-separator);
}

/* --- Rythme vertical (article.css) --- */
.pf-c-page .pf-c-article__main .pf-c-article__lead h2:is(.pf-c-article__subtitle, .pf-c-gate__label, .pf-c-error__code, .pf-c-error__subtitle) {
  margin: 0 0 1.25rem;
}

.pf-c-page .pf-c-article__main .pf-c-article__lead h2:is(.pf-c-article__subtitle, .pf-c-gate__label, .pf-c-error__code, .pf-c-error__subtitle):last-child {
  margin-bottom: 0;
}

.pf-c-page .pf-c-article__main .pf-c-article__lead .pf-c-article__cover {
  display: block;
  margin: 0 0 1.75rem;
}

.pf-c-page .pf-c-article__main .pf-c-article__lead + .pf-c-article__body {
  margin-top: 0.5rem;
}

.pf-c-page .pf-c-article__main .pf-c-article__header h1 :is(a, span, p, strong, em, b, i, small) {
  color: var(--pfcustom-type-h1-color);
}

.pf-c-page .pf-c-article__main .pf-c-article__lead h2:is(.pf-c-article__subtitle, .pf-c-gate__label, .pf-c-error__code, .pf-c-error__subtitle) {
  font-weight: 400;
  color: var(--pfcustom-color-white);
  opacity: 1;
}

.pf-c-page .pf-c-article__main .pf-c-article__lead h2:is(.pf-c-article__subtitle, .pf-c-gate__label, .pf-c-error__code, .pf-c-error__subtitle) :is(span, strong, em, b, i, small) {
  color: inherit;
  opacity: 1;
}

.pf-c-page .pf-c-article__main .pf-c-article__body.pf-c-prose :is(h2, h3) {
  margin-top: 0;
  padding: 0;
  text-align: inherit;
}

.pf-c-page .pf-c-article__main .pf-c-article__body.pf-c-prose h2 {
  font-weight: var(--pfcustom-type-h2-weight);
  color: var(--pfcustom-color-white);
}

.pf-c-page .pf-c-article__main .pf-c-article__body.pf-c-prose h3 {
  font-weight: var(--pfcustom-type-h3-weight);
  color: var(--pfcustom-color-white);
}

/* Chapô & corps d’article — texte blanc pur (liens : accent, règles ci-dessous) */
.pf-c-page .pf-c-article__main .pf-c-article__lead.pf-c-prose,
.pf-c-page .pf-c-article__main .pf-c-article__body.pf-c-prose {
  color: var(--pfcustom-color-white);
}

.pf-c-page .pf-c-article__main .pf-c-article__lead.pf-c-prose :is(p, li, blockquote, h4, h5, h6, figcaption, td, th, strong, b, em, i, u, span, div, cite, .writer-editable, .writer-list-item-text),
.pf-c-page .pf-c-article__main .pf-c-article__body.pf-c-prose :is(p, li, blockquote, h4, h5, h6, figcaption, td, th, strong, b, em, i, u, span, div, cite, .writer-editable, .writer-list-item-text) {
  color: var(--pfcustom-color-white);
}

.pf-c-page .pf-c-article__aside :is(h2.pf-c-author__name) {
  font-weight: var(--pfcustom-type-h2-weight);
  color: var(--pfcustom-type-h2-color);
}

.pf-c-page .pf-c-article__aside :is(h2.pf-c-author__name) :is(a, span, p, strong, em, b, i, small) {
  color: var(--pfcustom-type-h2-color);
}

/* --- « À propos » : réseaux sociaux toujours centrés (quel que soit l'alignement du titre) --- */
.pf-c-page .pf-c-article__aside ul.pf-c-socials {
  justify-content: center;
}

/* --- Barre d'article (confort de lecture + partage) ---
 * Markup tronc : .article-meta-block (en-tête) recopié dans .article-meta-block-footer
 * (pied d'article). Contrôles fantômes stylés par layout/reading.css : le thème ne
 * fait que brancher leurs variables --pf-ctl-* et les séparateurs sur ses tokens.
 */
.pf-c-page .pf-c-article__main {
  --pf-ctl-ink: var(--pfcustom-text);
  --pf-ctl-ink-soft: var(--pfcustom-text-muted);
  --pf-ctl-line: var(--pfcustom-border-separator-color);
  --pf-section-divider-width: var(--pfcustom-border-width);
  --pf-section-divider-color: var(--pfcustom-border-separator-color);
}

/* --- Liens --- */
.pf-c-article__main .pf-c-article__lead :is(a, h2:is(.pf-c-article__subtitle, .pf-c-gate__label, .pf-c-error__code, .pf-c-error__subtitle) a, p a):not(:is(.pf-c-btn, .pf-c-btn, :where(.pfcustom-btn, .pf-c-socials a, .pf-c-breadcrumb a, .pf-c-share__action--copy, .pf-c-share__action))),
.pf-c-article__main .pf-c-article__body.pf-c-prose :is(a, p a):not(:is(h1 a, h2 a, h3 a, h4 a, h5 a, h6 a, .pf-c-btn, .pf-c-btn, :where(.pfcustom-btn, .pf-c-socials a, .pf-c-breadcrumb a, .pf-c-share__action--copy, .pf-c-share__action))) {
  color: var(--pfcustom-accent);
  text-decoration: none;
  text-decoration-line: none;
  text-decoration-color: transparent;
  text-underline-offset: unset;
  border-bottom: 1px solid color-mix(in srgb, var(--pfcustom-accent) 45%, transparent);
  padding: 0 0 0.12rem;
  margin: 0;
  background: transparent;
  box-shadow: none;
  border-radius: 0;
  transition: color 0.15s ease, border-color 0.15s ease;
}

.pf-c-article__main .pf-c-article__lead :is(a, h2:is(.pf-c-article__subtitle, .pf-c-gate__label, .pf-c-error__code, .pf-c-error__subtitle) a, p a):not(:is(.pf-c-btn, .pf-c-btn, :where(.pfcustom-btn, .pf-c-socials a, .pf-c-breadcrumb a, .pf-c-share__action--copy, .pf-c-share__action))):is(:link, :visited, :hover, :active),
.pf-c-article__main .pf-c-article__body.pf-c-prose :is(a, p a):not(:is(h1 a, h2 a, h3 a, h4 a, h5 a, h6 a, .pf-c-btn, .pf-c-btn, :where(.pfcustom-btn, .pf-c-socials a, .pf-c-breadcrumb a, .pf-c-share__action--copy, .pf-c-share__action))):is(:link, :visited, :hover, :active) {
  color: var(--pfcustom-accent);
  text-decoration: none;
  text-decoration-line: none;
  border-bottom-color: color-mix(in srgb, var(--pfcustom-accent) 45%, transparent);
  background-color: transparent;
}

.pf-c-article__main .pf-c-article__lead :is(a, h2:is(.pf-c-article__subtitle, .pf-c-gate__label, .pf-c-error__code, .pf-c-error__subtitle) a, p a):not(:is(.pf-c-btn, .pf-c-btn, :where(.pfcustom-btn, .pf-c-socials a, .pf-c-breadcrumb a, .pf-c-share__action--copy, .pf-c-share__action))):hover,
.pf-c-article__main .pf-c-article__body.pf-c-prose :is(a, p a):not(:is(h1 a, h2 a, h3 a, h4 a, h5 a, h6 a, .pf-c-btn, .pf-c-btn, :where(.pfcustom-btn, .pf-c-socials a, .pf-c-breadcrumb a, .pf-c-share__action--copy, .pf-c-share__action))):hover {
  border-bottom-color: var(--pfcustom-accent);
}

.pf-c-article__main .pf-c-article__body.pf-c-prose :is(a, p a):not(:is(h1 a, h2 a, h3 a, h4 a, h5 a, h6 a, .pf-c-btn, .pf-c-btn, :where(.pfcustom-btn, .pf-c-socials a, .pf-c-breadcrumb a, .pf-c-share__action--copy, .pf-c-share__action))):focus-visible {
  outline: 2px solid color-mix(in srgb, var(--pfcustom-accent) 58%, transparent);
  outline-offset: 0.18em;
}

.pf-c-page .pf-c-article__main .pf-c-article__meta .pf-c-author__link {
  border-bottom: none;
  padding-bottom: 0;
  background: transparent;
  box-shadow: none;
}

/* Fusion : règles du site pour ce composant (venues de components/site/components.css) */
/*
 * Fiche projet (contents/projects.php) : masquer l’encart #about-content (« A propos » / auteur),
 * comme #blog-about sur la page article — HTML inchangé.
 * Le premier lien du fil d’ariane pointe vers la page « projects » ; exclut main#about (page À propos).
 */
.pf-c-page main:not(.pf-c-main:where([data-pf-page^="legal"] *, [data-pf-page="sitemap"] *)):has(.pf-c-hero .pf-c-breadcrumb li:first-child a[href*="/projects"]) .pf-c-author--card {
  display: none;
}

.pf-c-page .pf-c-author--card .pf-c-author__name {
  color: var(--pfcustom-text);
}

/* Fusion : règles du site pour ce composant (venues de components/site/contact.css) */
.pfcustom-contact .pf-c-hero .pf-c-prose {
  color: var(--pfcustom-text-muted);
}

.pfcustom-contact .pf-c-hero .pf-c-prose p {
  margin: 0.75rem 0 0;
}

/* Fusion : règles du site pour ce composant (venues de components/site/core-bridge.css) */
/* ----- Corps de texte (modules, légal, blog, projets…) — hors landings .pfcustom-landing ----- */
main:not(.pfcustom-landing) .pf-c-prose :is(p, li, blockquote) {
  color: var(--pfcustom-text-muted);
}

main:not(.pfcustom-landing) .pf-c-prose :is(strong, b) {
  color: var(--pfcustom-text);
  font-weight: var(--pfcustom-type-h3-weight);
}

/* ----- Liens inline corps (priorité sur content.css) ----- */
main:not(.pfcustom-landing) .pf-c-prose a:not(:is(h1 a, h2 a, h3 a, h4 a, h5 a, h6 a, .pf-c-btn, .pf-c-btn, :where(.pfcustom-btn, .pf-c-socials a, .pf-c-breadcrumb a, .pf-c-share__action--copy, .pf-c-share__action))),
main:not(.pfcustom-landing) .pf-c-prose p a:not(:is(h1 a, h2 a, h3 a, h4 a, h5 a, h6 a, .pf-c-btn, .pf-c-btn, :where(.pfcustom-btn, .pf-c-socials a, .pf-c-breadcrumb a, .pf-c-share__action--copy, .pf-c-share__action))),
.pf-c-page .pf-c-article__lead.pf-c-prose a {
  color: var(--pfcustom-accent);
  text-decoration: none;
  border-bottom: 1px solid color-mix(in srgb, var(--pfcustom-accent) 45%, transparent);
  padding-bottom: 0.12rem;
  text-decoration-line: none;
  text-decoration-color: transparent;
  background: transparent;
  border-radius: 0;
  box-shadow: none;
  transition: color 0.15s ease, border-color 0.15s ease;
}

main:not(.pfcustom-landing) .pf-c-prose a:not(:is(h1 a, h2 a, h3 a, h4 a, h5 a, h6 a, .pf-c-btn, .pf-c-btn, :where(.pfcustom-btn, .pf-c-socials a, .pf-c-breadcrumb a, .pf-c-share__action--copy, .pf-c-share__action))):hover,
main:not(.pfcustom-landing) .pf-c-prose p a:not(:is(h1 a, h2 a, h3 a, h4 a, h5 a, h6 a, .pf-c-btn, .pf-c-btn, :where(.pfcustom-btn, .pf-c-socials a, .pf-c-breadcrumb a, .pf-c-share__action--copy, .pf-c-share__action))):hover {
  color: color-mix(in srgb, var(--pfcustom-accent) 82%, var(--pfcustom-text));
  border-bottom-color: var(--pfcustom-accent);
  background-color: transparent;
}

main:not(.pfcustom-landing) .pf-c-prose a:not(:is(h1 a, h2 a, h3 a, h4 a, h5 a, h6 a, .pf-c-btn, .pf-c-btn, :where(.pfcustom-btn, .pf-c-socials a, .pf-c-breadcrumb a, .pf-c-share__action--copy, .pf-c-share__action))):focus-visible {
  outline: 2px solid color-mix(in srgb, var(--pfcustom-accent) 58%, transparent);
  outline-offset: 0.18em;
}

/* Fusion : règles du site pour ce composant (venues de components/site/frame.css) */
.pf-c-page .pf-c-article__main,
.pf-c-page .pf-c-article__aside {
  backdrop-filter: var(--pfcustom-glass-blur-filter);
  -webkit-backdrop-filter: var(--pfcustom-glass-blur-filter);
}

/* =============================================================================
 * Projets — liste / fiche : rythme de page, liens de section, alignements
 * (détails visuels cartes / hero dans templates/custom/css/components.css)
 * ============================================================================= */
.pf-c-page:has(main.pf-c-main:where([data-pf-page="projects"] *)) .pf-c-hero .pf-c-prose {
  text-align: inherit;
}

/* Fusion : règles du site pour ce composant (venues de components/site/headings-overlay.css) */
main:not(.pfcustom-landing) .pf-c-article__header h1 :is(a, span, p, strong, em, b, i, small),
main:not(.pfcustom-landing) .pf-c-author--card h1 :is(a, span, p, strong, em, b, i, small) {
  color: var(--pfcustom-type-h1-color);
}

/* Bloc « A propos » sur les fiches */
main:not(.pfcustom-landing) .pf-c-author--card h2.pf-c-author__name,
main:not(.pfcustom-landing) .pf-c-article__aside h2.pf-c-author__name {
  font-weight: var(--pfcustom-type-h2-weight);
  color: var(--pfcustom-type-h2-color);
  margin-top: 0;
}

main:not(.pfcustom-landing) .pf-c-author--card h2.pf-c-author__name :is(a, span, p, strong, em, b, i, small),
main:not(.pfcustom-landing) .pf-c-article__aside h2.pf-c-author__name :is(a, span, p, strong, em, b, i, small) {
  color: var(--pfcustom-type-h2-color);
}

/*
 * Les intertitres de gabarit (h2/h3) sont traités dans `section-titles.css`
 * via le crochet `.section-title`. Sous thème personnalisé le tronc n'émet
 * plus de classe `title-align-*` (portfolios_module_title_align_class()) :
 * les blocs d'alignement et de typo qui étaient ici ne matchaient plus rien.
 */
.pf-c-page .pf-c-article__lead h2:is(.pf-c-article__subtitle, .pf-c-gate__label, .pf-c-error__code, .pf-c-error__subtitle),
.pf-c-page .pf-c-article__lead h2:is(.pf-c-article__subtitle, .pf-c-gate__label, .pf-c-error__code, .pf-c-error__subtitle) :is(a, span, p, strong, em, b, i, small) {
  color: inherit;
}

/* TinyMCE / content-article (structure/layout/content.css) */
main:not(.pfcustom-landing) .pf-c-prose h1 {
  font-weight: var(--pfcustom-type-h1-weight);
  color: var(--pfcustom-type-h1-color);
  display: block;
  padding: 0;
}

main:not(.pfcustom-landing) .pf-c-prose h1 :is(a, span, p, strong, em, b, i, small) {
  color: var(--pfcustom-type-h1-color);
}

main:not(.pfcustom-landing) .pf-c-prose :is(h2, h3, h4, h5, h6) {
  font-weight: var(--pfcustom-type-h2-weight);
  color: var(--pfcustom-type-h2-color);
}

main:not(.pfcustom-landing) .pf-c-prose :is(h2, h3, h4, h5, h6) :is(a, span, p, strong, em, b, i, small) {
  color: var(--pfcustom-type-h2-color);
}

/* Fusion : règles du site pour ce composant (venues de components/site/hero.css) */
section.pf-c-hero.pfcustom-hero-sky .pf-c-prose,
section.pf-c-hero.pfcustom-hero-sky .pf-c-prose :is(p, li) {
  color: var(--pfcustom-text-muted);
  font-family: var(--pfcustom-font-family-sans);
}

/* Fusion : règles du site pour ce composant (venues de components/site/legals.css) */
.pf-c-page main.pf-c-main:where([data-pf-page^="legal"] *, [data-pf-page="sitemap"] *) section.pf-c-prose > article.pf-c-reading {
  max-width: min(100%, var(--pfcustom-showcase-max-width));
  margin-inline: auto;
  box-sizing: border-box;
}

/* Fusion : règles du site pour ce composant (venues de components/site/socials.css) */
/**
 * Réseaux sociaux — fichier unique (thème custom).
 * Footer, blocs « A propos » (socials.php).
 * Le partage d'article n'utilise plus .social-medias : barre .blog-article-bar
 * (confort de lecture + .pf-act) stylée par le tronc (layout/reading.css), teintée
 * par le thème dans modules/blog-article.css.
 * Prérequis : tokens --pfcustom-* via root.css (chargé une fois par css.php).
 */
/* =============================================================================
 * Icônes : liste commune (socials.css impose des !important côté portfolio)
 * ============================================================================= */
.pf-c-footer.pfcustom-footer .pfcustom-footer__social ul.pf-c-socials,
.pf-c-page .pf-c-article__aside ul.pf-c-socials,
.pf-c-page .pf-c-author--card ul.pf-c-socials,
.pf-c-page main.pf-c-main:where([data-pf-page^="legal"] *, [data-pf-page="sitemap"] *) .pf-c-hero__body ul.pf-c-socials,
.pf-c-page .pf-c-hero__text ul.pf-c-socials {
  display: flex;
  flex-wrap: wrap;
  gap: var(--pfcustom-space-footer-social-gap);
  list-style: none;
  padding: 0;
}

.pf-c-footer.pfcustom-footer .pfcustom-footer__social ul.pf-c-socials {
  margin: 0;
}

.pf-c-page .pf-c-article__aside ul.pf-c-socials,
.pf-c-page .pf-c-author--card ul.pf-c-socials,
.pf-c-page main.pf-c-main:where([data-pf-page^="legal"] *, [data-pf-page="sitemap"] *) .pf-c-hero__body ul.pf-c-socials,
.pf-c-page .pf-c-hero__text ul.pf-c-socials {
  margin: 0.75rem 0 0;
}

.pf-c-footer.pfcustom-footer .pfcustom-footer__social ul.pf-c-socials a svg path,
.pf-c-footer.pfcustom-footer .pfcustom-footer__social ul.pf-c-socials a svg circle,
.pf-c-footer.pfcustom-footer .pfcustom-footer__social ul.pf-c-socials a svg polygon,
.pf-c-page .pf-c-article__aside ul.pf-c-socials a svg path,
.pf-c-page .pf-c-article__aside ul.pf-c-socials a svg circle,
.pf-c-page .pf-c-article__aside ul.pf-c-socials a svg polygon,
.pf-c-page .pf-c-author--card ul.pf-c-socials a svg path,
.pf-c-page .pf-c-author--card ul.pf-c-socials a svg circle,
.pf-c-page .pf-c-author--card ul.pf-c-socials a svg polygon,
.pf-c-page main.pf-c-main:where([data-pf-page^="legal"] *, [data-pf-page="sitemap"] *) .pf-c-hero__body ul.pf-c-socials a svg path,
.pf-c-page main.pf-c-main:where([data-pf-page^="legal"] *, [data-pf-page="sitemap"] *) .pf-c-hero__body ul.pf-c-socials a svg circle,
.pf-c-page main.pf-c-main:where([data-pf-page^="legal"] *, [data-pf-page="sitemap"] *) .pf-c-hero__body ul.pf-c-socials a svg polygon,
.pf-c-page .pf-c-hero__text ul.pf-c-socials a svg path,
.pf-c-page .pf-c-hero__text ul.pf-c-socials a svg circle,
.pf-c-page .pf-c-hero__text ul.pf-c-socials a svg polygon {
  fill: currentColor;
}

.pf-c-footer.pfcustom-footer .pfcustom-footer__social ul.pf-c-socials a svg[stroke]:not([stroke="none"]),
.pf-c-page .pf-c-article__aside ul.pf-c-socials a svg[stroke]:not([stroke="none"]),
.pf-c-page .pf-c-author--card ul.pf-c-socials a svg[stroke]:not([stroke="none"]),
.pf-c-page main.pf-c-main:where([data-pf-page^="legal"] *, [data-pf-page="sitemap"] *) .pf-c-hero__body ul.pf-c-socials a svg[stroke]:not([stroke="none"]),
.pf-c-page .pf-c-hero__text ul.pf-c-socials a svg[stroke]:not([stroke="none"]) {
  stroke: currentColor;
}

/* Footer : nom de la plateforme + logo (show_label, structure/socials.php) —
   pastille compacte à largeur libre au lieu du bouton rond icône seule. */
.pf-c-footer.pfcustom-footer .pfcustom-footer__social ul.pf-c-socials--labeled {
  gap: 0.5rem;
}

.pf-c-footer.pfcustom-footer .pfcustom-footer__social ul.pf-c-socials--labeled .pf-c-socials__label {
  font-size: 0.8125rem;
  line-height: 1;
  letter-spacing: normal;
  color: inherit;
}

/* Nom de la plateforme : le thème custom ne charge pas navigation/socials.css, donc rien
   ne masquait le <span> (rendu dans le HTML pour le live-edit) ni l'icône générique. Sans
   cette règle, texte + bouton rond s'affichent ensemble (footer et « À propos »). */
.pf-c-page ul.pf-c-socials:not(.pf-c-socials--labeled) .pf-c-socials__label {
  display: none;
}

.pf-c-page ul.pf-c-socials .pf-c-socials__icon {
  display: contents;
}

.pf-c-page ul.pf-c-socials--labeled .pf-c-socials__icon {
  display: none;
}

.pf-c-page ul.pf-c-socials--labeled .pf-c-socials__label {
  display: block;
  margin: 0;
  line-height: 1;
  white-space: nowrap;
}

.pf-c-page .pf-c-article__aside ul.pf-c-socials--labeled .pf-c-socials__label,
.pf-c-page .pf-c-author--card ul.pf-c-socials--labeled .pf-c-socials__label,
.pf-c-page main.pf-c-main:where([data-pf-page^="legal"] *, [data-pf-page="sitemap"] *) .pf-c-hero__body ul.pf-c-socials--labeled .pf-c-socials__label,
.pf-c-page .pf-c-hero__text ul.pf-c-socials--labeled .pf-c-socials__label {
  font-size: 0.8125rem;
  letter-spacing: normal;
  color: inherit;
}

/* Alignement des réseaux « À propos » (hors blog, toujours centré : blog-article.css) selon le réglage du titre (align-*, about-align-*,
   title-align-* posés par le tronc) : navigation/socials.css, qui le gère, n'est pas chargé. */
.pf-c-page :is(.pf-c-author--card, main.pf-c-main:where([data-pf-page^="legal"] *, [data-pf-page="sitemap"] *) .pf-c-hero__body, .pf-c-hero__text) [data-pf-align="left"] ul.pf-c-socials,
.pf-c-page :is(.pf-c-author--card, .pf-c-hero__body, .pf-c-hero__text)[data-pf-align="left"] ul.pf-c-socials {
  justify-content: flex-start;
}

.pf-c-page :is(.pf-c-author--card, main.pf-c-main:where([data-pf-page^="legal"] *, [data-pf-page="sitemap"] *) .pf-c-hero__body, .pf-c-hero__text) [data-pf-align="center"] ul.pf-c-socials,
.pf-c-page :is(.pf-c-author--card, .pf-c-hero__body, .pf-c-hero__text)[data-pf-align="center"] ul.pf-c-socials {
  justify-content: center;
}

.pf-c-page :is(.pf-c-author--card, main.pf-c-main:where([data-pf-page^="legal"] *, [data-pf-page="sitemap"] *) .pf-c-hero__body, .pf-c-hero__text) [data-pf-align="right"] ul.pf-c-socials,
.pf-c-page :is(.pf-c-author--card, .pf-c-hero__body, .pf-c-hero__text)[data-pf-align="right"] ul.pf-c-socials {
  justify-content: flex-end;
}

/* =============================================================================
 * Équipe — page contact custom (.pfcustom-contact-member__socials)
 * ============================================================================= */
.pfcustom-contact .pfcustom-contact-member__socials ul.pf-c-socials {
  display: flex;
  flex-wrap: wrap;
  gap: var(--pfcustom-space-footer-social-gap);
  list-style: none;
  margin: 0;
  padding: 0;
}

.pfcustom-contact .pfcustom-contact-member__socials ul.pf-c-socials a svg :is(path, circle, polygon) {
  fill: currentColor;
}

.pfcustom-contact .pfcustom-contact-member__socials ul.pf-c-socials a svg[stroke]:not([stroke="none"]) {
  stroke: currentColor;
}

/* Fusion : règles du site pour ce composant (venues de components/site/type.css) */
/* Chapô hero blog / légal */
.pf-c-page main:is(.pf-c-main:where([data-pf-page="blog"] *), .pf-c-main:where([data-pf-page^="legal"] *, [data-pf-page="sitemap"] *)) .pf-c-hero .pf-c-prose,
.pf-c-page main:is(.pf-c-main:where([data-pf-page="blog"] *), .pf-c-main:where([data-pf-page^="legal"] *, [data-pf-page="sitemap"] *)) .pf-c-hero .pf-c-prose :is(p, li) {
  font-size: var(--pfcustom-type-body-size);
  line-height: var(--pfcustom-type-lead-line);
}

/* TinyMCE / content-article : h2–h6 unifiés en h2 (hors blog article corps) */
main:not(.pfcustom-landing) .pf-c-prose :is(h2, h3, h4, h5, h6) {
  font-size: var(--pfcustom-type-h2-size);
  line-height: var(--pfcustom-type-h2-line);
}

/* Blog article — corps WYSIWYG : h3 reprend sa taille */
.pf-c-page .pf-c-article__main .pf-c-article__body.pf-c-prose h3 {
  font-size: var(--pfcustom-type-h3-size);
  line-height: var(--pfcustom-type-h3-line);
}

/* Blog — chapô (h2.subtitle) : graisse corps, interligne h3 */
.pf-c-page .pf-c-article__main .pf-c-article__lead h2:is(.pf-c-article__subtitle, .pf-c-gate__label, .pf-c-error__code, .pf-c-error__subtitle) {
  font-size: var(--pfcustom-type-h2-size);
  line-height: var(--pfcustom-type-h3-line);
  font-weight: 400;
}

.pf-c-page .pf-c-article__main .pf-c-article__lead h2:is(.pf-c-article__subtitle, .pf-c-gate__label, .pf-c-error__code, .pf-c-error__subtitle) :is(span, strong, em, b, i, small) {
  font-size: inherit;
  line-height: inherit;
}

/* Chapôs — interligne lead (projets, fiches, contact) */
.pf-c-page main.pf-c-main:where([data-pf-page="projects"] *) .pf-c-hero .pf-c-prose :is(p, li) {
  line-height: var(--pfcustom-type-lead-line);
}



}