/**
 * Typographie globale — par BALISE, pas par composant.
 * Chargé en dernier par css.php (après headings.css) : seule source font-size / line-height.
 * Voir PERSONNALISATION.md §5.1.
 */

/* ----- Scope éditeur (priorité hub / simulation) ----- */
/* Les sélecteurs ci-dessous incluent body.portfolio-editor #webpage-simulation quand nécessaire. */

/* ----- Corps : texte courant + contrôles ----- */
#portfolio_page.portfolio-font :is(
  p,
  li,
  dt,
  dd,
  td,
  th,
  label,
  legend,
  address,
  blockquote,
  figcaption,
  a,
  button,
  input,
  select,
  textarea,
  summary
):not([class*="pfcustom-price"]),
body.portfolio-editor #webpage-simulation #portfolio_page.portfolio-font :is(
  p,
  li,
  dt,
  dd,
  td,
  th,
  label,
  legend,
  address,
  blockquote,
  figcaption,
  a,
  button,
  input,
  select,
  textarea,
  summary
):not([class*="pfcustom-price"]) {
  font-size: var(--pfcustom-type-body-size) !important;
  line-height: var(--pfcustom-type-body-line) !important;
}

/* Header — même échelle que le corps (taille + interligne strictes) */
#portfolio_page.portfolio-font #header.pfcustom-header :is(
  .pfcustom-nav > li > a,
  .pfcustom-nav__dropdown > summary,
  .pfcustom-nav__dropdown-panel a,
  .pfcustom-header__actions :is(a, button, span, .pfcustom-btn)
),
body.portfolio-editor #webpage-simulation #portfolio_page.portfolio-font #header.pfcustom-header :is(
  .pfcustom-nav > li > a,
  .pfcustom-nav__dropdown > summary,
  .pfcustom-nav__dropdown-panel a,
  .pfcustom-header__actions :is(a, button, span, .pfcustom-btn)
) {
  font-size: var(--pfcustom-type-header-size) !important;
  line-height: var(--pfcustom-type-header-line) !important;
}

/* Accordéon FAQ : titres WYSIWYG = corps */
#portfolio_page.portfolio-font .pfcustom-accordion :is(.pfcustom-accordion__body, .pfcustom-faq__answer) :is(h1, h2, h3, h4, h5, h6),
body.portfolio-editor #webpage-simulation #portfolio_page.portfolio-font .pfcustom-accordion :is(.pfcustom-accordion__body, .pfcustom-faq__answer) :is(h1, h2, h3, h4, h5, h6) {
  font-size: var(--pfcustom-type-body-size) !important;
  line-height: var(--pfcustom-type-body-line) !important;
}

/* Chapô hero blog / légal */
#portfolio_page.portfolio-font main:is(#blog, #about) #hero .content-article,
#portfolio_page.portfolio-font main:is(#blog, #about) #hero .content-article :is(p, li),
#portfolio_page.portfolio-font main#about #hero article :is(p, li),
body.portfolio-editor #webpage-simulation #portfolio_page.portfolio-font main:is(#blog, #about) #hero .content-article,
body.portfolio-editor #webpage-simulation #portfolio_page.portfolio-font main:is(#blog, #about) #hero .content-article :is(p, li),
body.portfolio-editor #webpage-simulation #portfolio_page.portfolio-font main#about #hero article :is(p, li) {
  font-size: var(--pfcustom-type-body-size) !important;
  line-height: var(--pfcustom-type-lead-line) !important;
}

/* Blog — libellé partage */
#portfolio_page.portfolio-font .blog-article-share__heading,
body.portfolio-editor #webpage-simulation #portfolio_page.portfolio-font .blog-article-share__heading {
  font-size: var(--pfcustom-type-body-size) !important;
  line-height: var(--pfcustom-type-body-line) !important;
  font-weight: 600 !important;
}

/* ----- Titres h1 ----- */
#portfolio_page.portfolio-font h1,
body.portfolio-editor #webpage-simulation #portfolio_page.portfolio-font h1 {
  font-size: var(--pfcustom-type-h1-size) !important;
  line-height: var(--pfcustom-type-h1-line) !important;
}

/* ----- Titres h2 ----- */
#portfolio_page.portfolio-font h2,
body.portfolio-editor #webpage-simulation #portfolio_page.portfolio-font h2 {
  font-size: var(--pfcustom-type-h2-size) !important;
  line-height: var(--pfcustom-type-h2-line) !important;
}

/* ----- Titres h3–h6 ----- */
#portfolio_page.portfolio-font :is(h3, h4, h5, h6),
body.portfolio-editor #webpage-simulation #portfolio_page.portfolio-font :is(h3, h4, h5, h6) {
  font-size: var(--pfcustom-type-h3-size) !important;
  line-height: var(--pfcustom-type-h3-line) !important;
}

/* Enfants de titres : héritent */
#portfolio_page.portfolio-font :is(h1, h2, h3, h4, h5, h6) :is(a, span, p, small, strong, em, b, i),
body.portfolio-editor #webpage-simulation #portfolio_page.portfolio-font :is(h1, h2, h3, h4, h5, h6) :is(a, span, p, small, strong, em, b, i) {
  font-size: inherit !important;
}

/* TinyMCE / content-article : h2–h6 unifiés en h2 (hors blog article corps) */
#portfolio_page.portfolio-font main:not(.pfcustom-landing) .content-article :is(h2, h3, h4, h5, h6),
body.portfolio-editor #webpage-simulation #portfolio_page.portfolio-font main:not(.pfcustom-landing) .content-article :is(h2, h3, h4, h5, h6) {
  font-size: var(--pfcustom-type-h2-size) !important;
  line-height: var(--pfcustom-type-h2-line) !important;
}

/* Blog article — corps WYSIWYG : h3 reprend sa taille */
#portfolio_page.portfolio-font #blog-main-article #content-article.content-article h3,
body.portfolio-editor #webpage-simulation #portfolio_page.portfolio-font #blog-main-article #content-article.content-article h3 {
  font-size: var(--pfcustom-type-h3-size) !important;
  line-height: var(--pfcustom-type-h3-line) !important;
}

/* Blog — chapô (h2.subtitle) : graisse corps, interligne h3 */
#portfolio_page.portfolio-font #blog-main-article #subtitle-article h2.subtitle,
#portfolio_page.portfolio-font #blog-main-article #subtitle-article h2.subtitle p,
body.portfolio-editor #webpage-simulation #portfolio_page.portfolio-font #blog-main-article #subtitle-article h2.subtitle,
body.portfolio-editor #webpage-simulation #portfolio_page.portfolio-font #blog-main-article #subtitle-article h2.subtitle p {
  font-size: var(--pfcustom-type-h2-size) !important;
  line-height: var(--pfcustom-type-h3-line) !important;
  font-weight: 400 !important;
}

#portfolio_page.portfolio-font #blog-main-article #subtitle-article h2.subtitle :is(span, strong, em, b, i, small),
body.portfolio-editor #webpage-simulation #portfolio_page.portfolio-font #blog-main-article #subtitle-article h2.subtitle :is(span, strong, em, b, i, small) {
  font-size: inherit !important;
  line-height: inherit !important;
}

/* Cookies — titre encart */
#portfolio_page.portfolio-font main#about .cookie-info h2,
body.portfolio-editor #webpage-simulation #portfolio_page.portfolio-font main#about .cookie-info h2 {
  font-size: var(--pfcustom-type-h2-size) !important;
  line-height: var(--pfcustom-type-h3-line) !important;
}

/* Titres cartes vignettes */
#portfolio_page.portfolio-font main :is(
  .vertical-infos,
  .horizontal-elements,
  .square-elements,
  .square-grid-item,
  .thumbnail,
  .thumbnail-tile
) :is(h4, h5),
body.portfolio-editor #webpage-simulation #portfolio_page.portfolio-font main :is(
  .vertical-infos,
  .horizontal-elements,
  .square-elements,
  .square-grid-item,
  .thumbnail,
  .thumbnail-tile
) :is(h4, h5) {
  font-size: var(--pfcustom-type-h3-size) !important;
  line-height: inherit !important;
}

/* Titre composé (wrapper h2) */
#portfolio_page.portfolio-font :is(h2.pfcustom-heading-split, h2.pfcustom-heading-pricing),
body.portfolio-editor #webpage-simulation #portfolio_page.portfolio-font :is(h2.pfcustom-heading-split, h2.pfcustom-heading-pricing) {
  font-size: inherit !important;
  line-height: normal !important;
}

#portfolio_page.portfolio-font :is(.pfcustom-heading-split__strong, .pfcustom-heading-pricing__strong),
body.portfolio-editor #webpage-simulation #portfolio_page.portfolio-font :is(.pfcustom-heading-split__strong, .pfcustom-heading-pricing__strong) {
  font-size: var(--pfcustom-type-h1-size) !important;
  line-height: var(--pfcustom-type-h1-line) !important;
}

#portfolio_page.portfolio-font :is(.pfcustom-heading-split__light, .pfcustom-heading-pricing__light),
body.portfolio-editor #webpage-simulation #portfolio_page.portfolio-font :is(.pfcustom-heading-split__light, .pfcustom-heading-pricing__light) {
  font-size: var(--pfcustom-type-h2-size) !important;
  line-height: var(--pfcustom-type-h2-line) !important;
}

/* ----- Rôles sémantiques (balise HTML ≠ niveau visuel) ----- */
#portfolio_page.portfolio-font :is(
  .pfcustom-landing .pfcustom-features__title,
  .pfcustom-landing .pfcustom-showcase__title,
  .pfcustom-landing .pfcustom-faq__title,
  .pfcustom-credits-header .pfcustom-features__title,
  .pfcustom-contact .pfcustom-contact-members__title,
  .pfcustom-contact .pfcustom-contact__identity .pfcustom-features__title
),
body.portfolio-editor #webpage-simulation #portfolio_page.portfolio-font :is(
  .pfcustom-landing .pfcustom-features__title,
  .pfcustom-landing .pfcustom-showcase__title,
  .pfcustom-landing .pfcustom-faq__title,
  .pfcustom-credits-header .pfcustom-features__title,
  .pfcustom-contact .pfcustom-contact-members__title,
  .pfcustom-contact .pfcustom-contact__identity .pfcustom-features__title
) {
  font-size: var(--pfcustom-type-h1-size) !important;
  line-height: var(--pfcustom-type-h1-line) !important;
}

#portfolio_page.portfolio-font :is(
  .pfcustom-landing .pfcustom-showcase__subtitle,
  .pfcustom-contact .pfcustom-contact-members__subtitle
),
body.portfolio-editor #webpage-simulation #portfolio_page.portfolio-font :is(
  .pfcustom-landing .pfcustom-showcase__subtitle,
  .pfcustom-contact .pfcustom-contact-members__subtitle
) {
  font-size: var(--pfcustom-type-h2-size) !important;
  line-height: var(--pfcustom-type-h2-line) !important;
}

#portfolio_page.portfolio-font :is(
  .pfcustom-landing .pfcustom-features__subtitle,
  .pfcustom-contact .pfcustom-contact__identity .pfcustom-features__subtitle,
  .pfcustom-landing p.pfcustom-hosting-fr__kicker,
  .pfcustom-contact-members__lede,
  .pfcustom-credits-header__tagline,
  .pfcustom-contact-member__role,
  .pfcustom-landing .pfcustom-faq__kicker,
  #technique ul > li:first-child
),
body.portfolio-editor #webpage-simulation #portfolio_page.portfolio-font :is(
  .pfcustom-landing .pfcustom-features__subtitle,
  .pfcustom-contact .pfcustom-contact__identity .pfcustom-features__subtitle,
  .pfcustom-landing p.pfcustom-hosting-fr__kicker,
  .pfcustom-contact-members__lede,
  .pfcustom-credits-header__tagline,
  .pfcustom-contact-member__role,
  .pfcustom-landing .pfcustom-faq__kicker,
  #technique ul > li:first-child
) {
  font-size: var(--pfcustom-type-caption-size) !important;
}

#portfolio_page.portfolio-font .pfcustom-contact-members__eyebrow,
body.portfolio-editor #webpage-simulation #portfolio_page.portfolio-font .pfcustom-contact-members__eyebrow {
  font-size: var(--pfcustom-type-xs) !important;
}

#portfolio_page.portfolio-font :is(
  .pfcustom-contact .pfcustom-contact__intro-body,
  .pfcustom-contact .pfcustom-contact__detail-label,
  .pfcustom-contact .pfcustom-contact__form-heading,
  .pfcustom-landing .pfcustom-project-card__headline,
  .pfcustom-landing .pfcustom-project-card__title
),
body.portfolio-editor #webpage-simulation #portfolio_page.portfolio-font :is(
  .pfcustom-contact .pfcustom-contact__intro-body,
  .pfcustom-contact .pfcustom-contact__detail-label,
  .pfcustom-contact .pfcustom-contact__form-heading,
  .pfcustom-landing .pfcustom-project-card__headline,
  .pfcustom-landing .pfcustom-project-card__title
) {
  font-size: var(--pfcustom-type-h3-size) !important;
  line-height: var(--pfcustom-type-h3-line) !important;
}

#portfolio_page.portfolio-font .pfcustom-contact .pfcustom-contact__intro-body :is(p, li),
body.portfolio-editor #webpage-simulation #portfolio_page.portfolio-font .pfcustom-contact .pfcustom-contact__intro-body :is(p, li) {
  font-size: inherit !important;
  line-height: inherit !important;
}

#portfolio_page.portfolio-font .pfcustom-landing .pfcustom-discord__title,
body.portfolio-editor #webpage-simulation #portfolio_page.portfolio-font .pfcustom-landing .pfcustom-discord__title {
  font-size: var(--pfcustom-type-h2-size) !important;
  line-height: var(--pfcustom-type-h2-line) !important;
}

#portfolio_page.portfolio-font :is(
  .pfcustom-contact-member__desc,
  #title-about p,
  .pfcustom-landing .pfcustom-project-card--light p,
  .pfcustom-landing .pfcustom-discord__text,
  #technique ul > li:last-child
),
body.portfolio-editor #webpage-simulation #portfolio_page.portfolio-font :is(
  .pfcustom-contact-member__desc,
  #title-about p,
  .pfcustom-landing .pfcustom-project-card--light p,
  .pfcustom-landing .pfcustom-discord__text,
  #technique ul > li:last-child
) {
  font-size: var(--pfcustom-type-project-body-size) !important;
}

#portfolio_page.portfolio-font :is(
  .pfcustom-landing .pfcustom-feature-card__arrow,
  .pfcustom-contact .pfcustom-feature-card__arrow
),
body.portfolio-editor #webpage-simulation #portfolio_page.portfolio-font :is(
  .pfcustom-landing .pfcustom-feature-card__arrow,
  .pfcustom-contact .pfcustom-feature-card__arrow
) {
  font-size: var(--pfcustom-type-feature-arrow-size) !important;
}

#portfolio_page.portfolio-font :is(
  #header.pfcustom-header .pfcustom-brand,
  #header.pfcustom-header .pfcustom-brand__text
),
body.portfolio-editor #webpage-simulation #portfolio_page.portfolio-font :is(
  #header.pfcustom-header .pfcustom-brand,
  #header.pfcustom-header .pfcustom-brand__text
) {
  font-size: var(--pfcustom-type-brand-size) !important;
  line-height: var(--pfcustom-type-h2-line) !important;
}

#portfolio_page.portfolio-font #footer.pfcustom-footer .pfcustom-brand,
body.portfolio-editor #webpage-simulation #portfolio_page.portfolio-font #footer.pfcustom-footer .pfcustom-brand {
  font-size: var(--pfcustom-type-footer-brand-size) !important;
}

#portfolio_page.portfolio-font :is(
  .horizontal-grid-item h4
),
body.portfolio-editor #webpage-simulation #portfolio_page.portfolio-font :is(
  .horizontal-grid-item h4
) {
  font-size: var(--pfcustom-type-h3-size) !important;
  line-height: var(--pfcustom-type-h3-line) !important;
}

#portfolio_page.portfolio-font .horizontal-grid-item .horizontal-infos p,
body.portfolio-editor #webpage-simulation #portfolio_page.portfolio-font .horizontal-grid-item .horizontal-infos p {
  font-size: var(--pfcustom-type-caption-size) !important;
}

/* Landing — chapô hero, kicker, FAQ */
#portfolio_page.portfolio-font .pfcustom-landing .pfcustom-hero__intro,
body.portfolio-editor #webpage-simulation #portfolio_page.portfolio-font .pfcustom-landing .pfcustom-hero__intro {
  font-size: var(--pfcustom-type-hero-text-size) !important;
  line-height: var(--pfcustom-type-body-line) !important;
}

/* FAQ — conteneurs WYSIWYG (div) : héritent sinon du font-size inline de #portfolio_page */
#portfolio_page.portfolio-font .pfcustom-accordion :is(.pfcustom-accordion__body, .pfcustom-faq__answer),
#portfolio_page.portfolio-font .pfcustom-faq__answer :is(p, li, div, span, a, td, th, blockquote, figcaption),
body.portfolio-editor #webpage-simulation #portfolio_page.portfolio-font .pfcustom-accordion :is(.pfcustom-accordion__body, .pfcustom-faq__answer),
body.portfolio-editor #webpage-simulation #portfolio_page.portfolio-font .pfcustom-faq__answer :is(p, li, div, span, a, td, th, blockquote, figcaption) {
  font-size: var(--pfcustom-type-body-size) !important;
}

#portfolio_page.portfolio-font :is(
  .pfcustom-features__subtitle,
  .pfcustom-landing .pfcustom-faq__kicker,
  .pfcustom-landing p.pfcustom-hosting-fr__kicker
),
body.portfolio-editor #webpage-simulation #portfolio_page.portfolio-font :is(
  .pfcustom-features__subtitle,
  .pfcustom-landing .pfcustom-faq__kicker,
  .pfcustom-landing p.pfcustom-hosting-fr__kicker
) {
  line-height: var(--pfcustom-type-kicker-line) !important;
}

#portfolio_page.portfolio-font .pfcustom-faq__answer,
#portfolio_page.portfolio-font .pfcustom-faq__answer :is(p, li),
body.portfolio-editor #webpage-simulation #portfolio_page.portfolio-font .pfcustom-faq__answer,
body.portfolio-editor #webpage-simulation #portfolio_page.portfolio-font .pfcustom-faq__answer :is(p, li) {
  line-height: var(--pfcustom-faq-answer-line-height) !important;
}

#portfolio_page.portfolio-font .pfcustom-landing .pfcustom-pricing-card .promo-banner,
#portfolio_page.portfolio-font .pfcustom-landing .pfcustom-price__note,
body.portfolio-editor #webpage-simulation #portfolio_page.portfolio-font .pfcustom-landing .pfcustom-pricing-card .promo-banner,
body.portfolio-editor #webpage-simulation #portfolio_page.portfolio-font .pfcustom-landing .pfcustom-price__note {
  font-size: var(--pfcustom-type-caption-size) !important;
}

/* Chapôs — interligne lead (projets, fiches, contact) */
#portfolio_page.portfolio-font main#projects #hero .content-article :is(p, li),
#portfolio_page.portfolio-font #title-about p,
#portfolio_page.portfolio-font #content article.main :is(p, li),
#portfolio_page.portfolio-font #thanks article.main p,
#portfolio_page.portfolio-font .pfcustom-contact-members__lede,
body.portfolio-editor #webpage-simulation #portfolio_page.portfolio-font main#projects #hero .content-article :is(p, li),
body.portfolio-editor #webpage-simulation #portfolio_page.portfolio-font #title-about p,
body.portfolio-editor #webpage-simulation #portfolio_page.portfolio-font #content article.main :is(p, li),
body.portfolio-editor #webpage-simulation #portfolio_page.portfolio-font #thanks article.main p,
body.portfolio-editor #webpage-simulation #portfolio_page.portfolio-font .pfcustom-contact-members__lede {
  line-height: var(--pfcustom-type-lead-line) !important;
}

/* Modal cookies (footer — hors #portfolio_page) */
#welcome-to h3 {
  font-size: var(--pfcustom-type-h3-size) !important;
  line-height: var(--pfcustom-type-h2-line) !important;
}

#welcome-to #welcome-to-text :is(p, li) {
  font-size: var(--pfcustom-type-body-size) !important;
  line-height: var(--pfcustom-type-body-line) !important;
}

/* ----- Méta : <small> ----- */
#portfolio_page.portfolio-font small,
body.portfolio-editor #webpage-simulation #portfolio_page.portfolio-font small {
  font-size: var(--pfcustom-type-caption-size) !important;
}

/* ----- Boutons / chrome ----- */
#portfolio_page.portfolio-font :is(
  button,
  .pfcustom-btn,
  .folio_button,
  .folio-button,
  [type="submit"],
  [type="button"],
  [type="reset"]
),
body.portfolio-editor #webpage-simulation #portfolio_page.portfolio-font :is(
  button,
  .pfcustom-btn,
  .folio_button,
  .folio-button,
  [type="submit"],
  [type="button"],
  [type="reset"]
) {
  font-size: var(--pfcustom-btn-font-size) !important;
}

#portfolio_page.portfolio-font #footer.pfcustom-footer :is(a, p, li, button, span, h3),
body.portfolio-editor #webpage-simulation #portfolio_page.portfolio-font #footer.pfcustom-footer :is(a, p, li, button, span, h3) {
  font-size: var(--pfcustom-type-nav-size) !important;
}

#portfolio_page.portfolio-font #footer.pfcustom-footer .pfcustom-footer__legal,
#portfolio_page.portfolio-font #footer.pfcustom-footer .pfcustom-footer__legal :is(a, li, ul, span, p, small),
body.portfolio-editor #webpage-simulation #portfolio_page.portfolio-font #footer.pfcustom-footer .pfcustom-footer__legal,
body.portfolio-editor #webpage-simulation #portfolio_page.portfolio-font #footer.pfcustom-footer .pfcustom-footer__legal :is(a, li, ul, span, p, small) {
  font-size: var(--pfcustom-type-2xs) !important;
}

#portfolio_page.portfolio-font .pfcustom-landing-steps-demo__tab,
body.portfolio-editor #webpage-simulation #portfolio_page.portfolio-font .pfcustom-landing-steps-demo__tab {
  font-size: var(--pfcustom-type-xs) !important;
  text-transform: none !important;
  letter-spacing: normal !important;
}

#portfolio_page.portfolio-font .ariane :is(a, li, span),
body.portfolio-editor #webpage-simulation #portfolio_page.portfolio-font .ariane :is(a, li, span) {
  font-size: var(--pfcustom-type-nav-size) !important;
}

/* Pastille catégorie blog */
#portfolio_page.portfolio-font main :is(.thumbnail, .thumbnail-tile) .article-blog-infos__title,
body.portfolio-editor #webpage-simulation #portfolio_page.portfolio-font main :is(.thumbnail, .thumbnail-tile) .article-blog-infos__title {
  font-size: var(--pfcustom-type-h3-size) !important;
  line-height: var(--pfcustom-type-h3-line) !important;
}

#portfolio_page.portfolio-font main .thumbnail .article-blog-infos__category,
#portfolio_page.portfolio-font main .thumbnail-tile .article-blog-infos__category,
#portfolio_page.portfolio-font .blog-list .article-blog-infos__category,
#portfolio_page.portfolio-font span.article-blog-infos__category,
body.portfolio-editor #webpage-simulation #portfolio_page.portfolio-font main .thumbnail .article-blog-infos__category,
body.portfolio-editor #webpage-simulation #portfolio_page.portfolio-font main .thumbnail-tile .article-blog-infos__category {
  font-size: var(--pfcustom-type-2xs) !important;
  line-height: var(--pfcustom-type-2xs-line) !important;
}