/* Version: 23-09-2026-20-19 */
/*
 * Titres de gabarit : couleurs / tailles du setup (variables primary / secondary).
 * Titres in-body (.content-article) : voir structure/layout/content.css
 */

/* Logo / titre : taille pilotée par --portfolios-logo-title-size (dérivé du curseur setup / customizer) */
#portfolio_page #hub-logo .hub-logo__mark--text {
    font-size: var(--portfolios-logo-title-size, 20px) !important;
    line-height: calc(var(--portfolios-logo-title-size, 20px) + 2px) !important;
    font-weight: bold !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* Titres principaux de contenu (h1) — sélecteurs hors blocs TinyMCE */
#portfolio_page #title-article h1,
#portfolio_page #about-content h1,
#portfolio_page #hero #title-star #title-about h1,
#portfolio_page #title-star #title-about h1,
#portfolio_page main h1.pf-w-content,
#portfolio_page main#about section article h1,
#portfolio_page #quatrecentquatre-elements h1,
#portfolio_page main section#hero > div > h1 {
    font-size: var(--portfolios-heading-primary-size) !important;
    line-height: var(--portfolios-heading-primary-line-height, calc(var(--portfolios-heading-primary-size) + 2px)) !important;
    font-weight: bold !important;
    color: var(--portfolios-heading-primary-color) !important;
    display: block !important;
    padding: 0 !important;
}

#portfolio_page #title-article h1 :is(a, span, p, strong, em, b, i, small),
#portfolio_page #about-content h1 :is(a, span, p, strong, em, b, i, small),
#portfolio_page #hero #title-star #title-about h1 :is(a, span, p, strong, em, b, i, small),
#portfolio_page #title-star #title-about h1 :is(a, span, p, strong, em, b, i, small),
#portfolio_page main h1.pf-w-content :is(a, span, p, strong, em, b, i, small),
#portfolio_page main#about section article h1 :is(a, span, p, strong, em, b, i, small),
#portfolio_page #quatrecentquatre-elements h1 :is(a, span, p, strong, em, b, i, small),
#portfolio_page main section#hero > div > h1 :is(a, span, p, strong, em, b, i, small) {
    color: var(--portfolios-heading-primary-color) !important;
}

/* Bloc « A propos » sur les fiches : nom du portfolio (title_about) — échelle h2 du thème, couleur du texte courant */
#portfolio_page #about-content .about-card-title,
#portfolio_page #blog-about .about-card-title {
    font-size: var(--portfolios-heading-secondary-size) !important;
    line-height: var(--portfolios-heading-secondary-line-height, calc(var(--portfolios-heading-secondary-size) + 10px)) !important;
    font-weight: bold !important;
    color: inherit !important;
    margin-top: 0 !important;
}

#portfolio_page #about-content .about-card-title :is(a, span, p, strong, em, b, i, small),
#portfolio_page #blog-about .about-card-title :is(a, span, p, strong, em, b, i, small) {
    color: inherit !important;
}

/*
 * Accueil — hero (#title-home) et vedettes (.home-feature-vedette) :
 * couleurs définies dans manage (home_custom.color_home_custom, color_feature_element).
 * Variables optionnelles posées dans public/pages/home.php ; sinon repli sur le thème.
 */
#portfolio_page #hero #title-home {
    --home-hero-title-color: var(--portfolios-heading-primary-color);
    --home-hero-subtitle-color: var(--portfolios-heading-secondary-color);
}

#portfolio_page #hero #title-home #home-about h1,
#portfolio_page #hero #title-home #home-present h1 {
    font-size: var(--portfolios-heading-primary-size) !important;
    line-height: var(--portfolios-heading-primary-line-height, calc(var(--portfolios-heading-primary-size) + 2px)) !important;
    font-weight: bold !important;
    color: var(--home-hero-title-color) !important;
    display: block !important;
    padding: 0 !important;
}

#portfolio_page #hero #title-home #home-about h1 :is(a, span, p, strong, em, b, i, small),
#portfolio_page #hero #title-home #home-present h1 :is(a, span, p, strong, em, b, i, small) {
    color: var(--home-hero-title-color) !important;
}

#portfolio_page #hero #title-home #home-about h2,
#portfolio_page #hero #title-home #home-present h2 {
    font-size: var(--portfolios-heading-secondary-size) !important;
    line-height: var(--portfolios-heading-secondary-line-height, calc(var(--portfolios-heading-secondary-size) + 10px)) !important;
    font-weight: bold !important;
    color: var(--home-hero-subtitle-color) !important;
}

#portfolio_page #hero #title-home #home-about h2 :is(a, span, p, strong, em, b, i, small),
#portfolio_page #hero #title-home #home-present h2 :is(a, span, p, strong, em, b, i, small) {
    color: var(--home-hero-subtitle-color) !important;
}

#portfolio_page section.home-feature-vedette {
    --home-feature-title-color: var(--portfolios-heading-primary-color);
    --home-feature-subtitle-color: var(--portfolios-heading-secondary-color);
}

#portfolio_page section.home-feature-vedette #feature-about h1,
#portfolio_page section.home-feature-vedette #feature-present h1 {
    font-size: var(--portfolios-heading-primary-size) !important;
    line-height: var(--portfolios-heading-primary-line-height, calc(var(--portfolios-heading-primary-size) + 2px)) !important;
    font-weight: bold !important;
    color: var(--home-feature-title-color) !important;
    display: block !important;
    padding: 0 !important;
}

#portfolio_page section.home-feature-vedette #feature-about h1 :is(a, span, p, strong, em, b, i, small),
#portfolio_page section.home-feature-vedette #feature-present h1 :is(a, span, p, strong, em, b, i, small) {
    color: var(--home-feature-title-color) !important;
}

#portfolio_page section.home-feature-vedette #feature-about h2,
#portfolio_page section.home-feature-vedette #feature-present h2 {
    font-size: var(--portfolios-heading-secondary-size) !important;
    line-height: var(--portfolios-heading-secondary-line-height, calc(var(--portfolios-heading-secondary-size) + 10px)) !important;
    font-weight: bold !important;
    color: var(--home-feature-subtitle-color) !important;
    margin: 0 !important;
}

#portfolio_page section.home-feature-vedette #feature-about h2 :is(a, span, p, strong, em, b, i, small),
#portfolio_page section.home-feature-vedette #feature-present h2 :is(a, span, p, strong, em, b, i, small) {
    color: var(--home-feature-subtitle-color) !important;
}

/* Accueil — rythme vertical commun hero + vedettes : marges sous titre / sous-titre uniquement */
#portfolio_page #hero #title-home :is(#home-about, #home-present) h1,
#portfolio_page section.home-feature-vedette :is(#feature-about, #feature-present) h1 {
    margin: 0 0 8px !important;
}

#portfolio_page #hero #title-home :is(#home-about, #home-present) h2,
#portfolio_page section.home-feature-vedette :is(#feature-about, #feature-present) h2 {
    margin: 0 0 20px !important;
}

/* Équipe (/team) — nom membre h1, rôle h2 */
#portfolio_page .member-head h1,
#profil-modal-root .member-head h1 {
    font-size: var(--portfolios-heading-primary-size) !important;
    line-height: var(--portfolios-heading-primary-line-height, calc(var(--portfolios-heading-primary-size) + 2px)) !important;
    font-weight: bold !important;
    color: var(--portfolios-heading-primary-color) !important;
    margin: 0 !important;
    padding: 0 !important;
}

#portfolio_page .member-head h1 :is(a, span, p, strong, em, b, i, small),
#profil-modal-root .member-head h1 :is(a, span, p, strong, em, b, i, small) {
    color: var(--portfolios-heading-primary-color) !important;
}

#portfolio_page .member-head h2,
#profil-modal-root .member-head h2 {
    font-size: var(--portfolios-heading-secondary-size) !important;
    line-height: var(--portfolios-heading-secondary-line-height, calc(var(--portfolios-heading-secondary-size) + 10px)) !important;
    font-weight: bold !important;
    color: var(--portfolios-heading-secondary-color) !important;
    margin: 0 !important;
    padding: 0 !important;
}

#portfolio_page .member-head h2 :is(a, span, p, strong, em, b, i, small),
#profil-modal-root .member-head h2 :is(a, span, p, strong, em, b, i, small) {
    color: var(--portfolios-heading-secondary-color) !important;
}

/* Sous-titres de hero (ex. « De … », sous-titre album) */
#portfolio_page #hero #title-star #title-about h2,
#portfolio_page #title-star #title-about h2 {
    font-size: var(--portfolios-heading-secondary-size) !important;
    line-height: var(--portfolios-heading-secondary-line-height, calc(var(--portfolios-heading-secondary-size) + 10px)) !important;
    font-weight: bold !important;
    color: var(--portfolios-heading-secondary-color) !important;
    margin: 0 !important;
}

#portfolio_page #hero #title-star #title-about h2 :is(a, span, p, strong, em, b, i, small),
#portfolio_page #title-star #title-about h2 :is(a, span, p, strong, em, b, i, small) {
    color: var(--portfolios-heading-secondary-color) !important;
}

/* Hero contenus (#title-content) : ne pas imposer la couleur thème sur h1/h2 (lisibilité sur image / héritage) */
#portfolio_page #hero #title-content #title-about h1,
#portfolio_page #hero #title-content #title-about h2 {
    color: inherit !important;
}

#portfolio_page #hero #title-content #title-about h1 :is(a, span, p, strong, em, b, i, small),
#portfolio_page #hero #title-content #title-about h2 :is(a, span, p, strong, em, b, i, small) {
    color: inherit !important;
}

/* Intertitres de mise en page : classes title-align / padding-bottom (accueil, modules, etc.) */
/* :not(#h2_demo) : la démo setup thème (#theme-visualiser) garde ses styles inline sur le sous-titre */
#portfolio_page main h2.subtitle {
    font-size: var(--portfolios-heading-secondary-size) !important;
    line-height: var(--portfolios-heading-secondary-line-height, calc(var(--portfolios-heading-secondary-size) + 10px)) !important;
    font-weight: bold !important;
    color: var(--portfolios-heading-secondary-color) !important;
    margin-top: 0 !important;
    padding: 0 !important;
}

#portfolio_page main h2[class*="title-align-left"]:not(#h2_demo),
#portfolio_page main h2[class*="pf-pb-"][class*="title-align-left"]:not(#h2_demo),
#portfolio_page main h3[class*="title-align-left"],
#portfolio_page main h3[class*="pf-pb-"][class*="title-align-left"] {
    text-align: left !important;
}

#portfolio_page main h2[class*="title-align-center"]:not(#h2_demo),
#portfolio_page main h2[class*="pf-pb-"][class*="title-align-center"]:not(#h2_demo),
#portfolio_page main h3[class*="title-align-center"],
#portfolio_page main h3[class*="pf-pb-"][class*="title-align-center"] {
    text-align: center !important;
}

#portfolio_page main h2[class*="title-align-right"]:not(#h2_demo),
#portfolio_page main h2[class*="pf-pb-"][class*="title-align-right"]:not(#h2_demo),
#portfolio_page main h3[class*="title-align-right"],
#portfolio_page main h3[class*="pf-pb-"][class*="title-align-right"] {
    text-align: right !important;
}

#portfolio_page main h2.section-title:not(#h2_demo) :is(a, span, p, strong, em, b, i, small),
#portfolio_page main h2.pf-mt-lg :is(a, span, p, strong, em, b, i, small),
#portfolio_page main h3[class*="title-align"] :is(a, span, p, strong, em, b, i, small),
#portfolio_page main h3[class*="pf-pb-"][class*="title-align"] :is(a, span, p, strong, em, b, i, small),
#portfolio_page main section:not(.demo-pair-section) > article > h2 :is(a, span, p, strong, em, b, i, small),
#portfolio_page main h2.subtitle :is(a, span, p, strong, em, b, i, small) {
    color: var(--portfolios-heading-secondary-color) !important;
}

/*
 * Intertitres de gabarit : la typographie (taille, couleur, graisse, marges)
 * est portée par `.section-title`, émise systématiquement par
 * portfolios_module_heading_classes() — y compris sous thème personnalisé, où
 * `title-align-*` n'est volontairement pas émis. Les classes `title-align-*` ne
 * pilotent plus que `text-align` (bloc ci-dessus).
 *
 * Les six propriétés ci-dessous sont verrouillées en `!important` : un thème
 * personnalisé qui veut ses propres intertitres doit les contester une à une,
 * et pas seulement `color` / `font-weight` — voir custom/css/base/section-titles.css.
 * Le sélecteur `section > article > h2` attrape aussi les titres écrits à la
 * main dans un thème custom : ceux-là passent par `.pfcustom-section-title`.
 */
#portfolio_page main h2.section-title:not(#h2_demo),
#portfolio_page main h2.pf-mt-lg,
#portfolio_page main h3[class*="title-align"],
#portfolio_page main h3[class*="pf-pb-"][class*="title-align"],
#portfolio_page main section:not(.demo-pair-section) > article > h2 {
    font-size: var(--portfolios-heading-secondary-size) !important;
    line-height: var(--portfolios-heading-secondary-line-height, calc(var(--portfolios-heading-secondary-size) + 10px)) !important;
    font-weight: bold !important;
    color: var(--portfolios-heading-secondary-color) !important;
    margin-top: 0 !important;
    padding: 0 !important;
}

/* Titres de sections (accueil / modules) : couleur « titres » du setup, pas « sous-titres » */
#portfolio_page main section.section-bg h2.section-title:not(#h2_demo),
#portfolio_page main section.section-content:not(.customizer-demo-section) h2.section-title:not(#h2_demo),
#portfolio_page main section.section-bg h3[class*="title-align"],
#portfolio_page main section.section-content:not(.customizer-demo-section) h3[class*="title-align"] {
    color: var(--portfolios-heading-primary-color) !important;
}

#portfolio_page main section.section-bg h2.section-title:not(#h2_demo) :is(a, span, p, strong, em, b, i, small),
#portfolio_page main section.section-content:not(.customizer-demo-section) h2.section-title:not(#h2_demo) :is(a, span, p, strong, em, b, i, small),
#portfolio_page main section.section-bg h3[class*="title-align"] :is(a, span, p, strong, em, b, i, small),
#portfolio_page main section.section-content:not(.customizer-demo-section) h3[class*="title-align"] :is(a, span, p, strong, em, b, i, small) {
    color: var(--portfolios-heading-primary-color) !important;
}

#portfolio_page #subtitle-article h2.subtitle,
#portfolio_page #subtitle-article h2.subtitle :is(a, span, p, strong, em, b, i, small) {
    color: inherit !important;
}

/* Titres de cartes / listes : ne pas appliquer la typo « intertitre » du thème */
#portfolio_page main .vertical-infos h4,
#portfolio_page main .vertical-infos h5,
#portfolio_page main .pf-thumbs--landscape h4,
#portfolio_page main .pf-thumbs--square h4,
#portfolio_page main .square-grid-item h4,
#portfolio_page main .thumbnail h4,
#portfolio_page main .thumbnail h5,
#portfolio_page main .thumbnail-tile h4,
#portfolio_page main .thumbnail-tile h5 {
    font-size: inherit !important;
    font-weight: inherit !important;
    line-height: inherit !important;
    color: inherit !important;
    margin: 0 !important;
    padding: 0 !important;
    text-align: inherit !important;
}

/* Surimpressions grille (photo + dégradé) : couleurs personnalisables */
#portfolio_page main .horizontal-infos :is(h4, h5, a, span),
#portfolio_page main .vertical-infos :is(h4, h5, a, span),
#portfolio_page main .square-infos :is(h4, h5, a, span),
#portfolio_page .horizontal-infos :is(h4, h5, a, span),
#portfolio_page .vertical-infos :is(h4, h5, a, span),
#portfolio_page .square-infos :is(h4, h5, a, span),
#theme-visualiser #portfolio_page .horizontal-infos :is(h4, h5, a, span),
#theme-visualiser #portfolio_page .vertical-infos :is(h4, h5, a, span),
#theme-visualiser #portfolio_page .square-infos :is(h4, h5, a, span) {
    color: var(--portfolios-thumbnail-overlay-title-color, #ffffff) !important;
    text-shadow: var(--portfolios-thumbnail-overlay-text-shadow, none);
}

#portfolio_page main .horizontal-infos p,
#portfolio_page main .vertical-infos p,
#portfolio_page main .square-infos p,
#portfolio_page .horizontal-infos p,
#portfolio_page .vertical-infos p,
#portfolio_page .square-infos p,
#theme-visualiser #portfolio_page .horizontal-infos p,
#theme-visualiser #portfolio_page .vertical-infos p,
#theme-visualiser #portfolio_page .square-infos p {
    color: var(--portfolios-thumbnail-overlay-description-color, #ffffff) !important;
    text-shadow: var(--portfolios-thumbnail-overlay-text-shadow, none);
}