/*
 * Pubzone V2.2 — hiérarchie typographique unifiée
 * Référence : en-tête et panneaux du dashboard V2.
 */

:root {
  --pz-page-title: clamp(30px, 2.2vw, 38px);
  --pz-section-title: clamp(22px, 1.7vw, 28px);
  --pz-card-title: 18px;
  --pz-body-text: 15px;
  --pz-small-text: 13px;
  --pz-kicker-text: 11px;
  --pz-copy-line: 1.65;
}

/* Titres de page : même gabarit que le dashboard. */
.hero h1,
.subpage-hero h1,
.market-hero h1,
.auth-brand h1,
.dash-welcome h1 {
  font-size: var(--pz-page-title);
  line-height: 1.12;
  letter-spacing: -1.3px;
  text-wrap: balance;
}

.hero h1,
.subpage-hero h1,
.market-hero h1 {
  max-width: 760px;
}

.subpage-hero {
  padding: 68px 0 82px;
}

.subpage-hero h1 em {
  display: inline;
}

/* Sous-titres et introductions. */
.hero-copy > p,
.subpage-hero p,
.market-hero p,
.auth-brand p,
.auth-form > p,
.dash-welcome p,
.section-heading > p,
.market-copy > p,
.process-copy p,
.safe-seo-section > .section-shell > div:first-child > p,
.contact-info > p,
.story-grid > div:last-child p,
.french-build p,
.pricing-note p,
.legal-content p,
.faq-list article > p,
.faq-list details > p {
  font-size: var(--pz-body-text);
  line-height: var(--pz-copy-line);
}

/* Titres de sections et de panneaux. */
.section-heading h2,
.market-copy h2,
.cta-card h2,
.credit-pricing h2,
.pricing-note h2,
.process-copy h2,
.safe-seo-section h2,
.contact-info h2,
.quick-help h2,
.story-grid h2,
.french-build h2,
.auth-form h2,
.panel-title h2,
.performance-cta h2,
.integration-head h2 {
  font-size: var(--pz-section-title);
  line-height: 1.22;
  letter-spacing: -.7px;
  text-wrap: balance;
}

.eyebrow,
.kicker,
.dash-welcome > div > span,
.panel-title > div > span,
.form-panel-head > div > span,
.verify-head > div > span,
.exchange-proposal > div > span,
.contact-info > span,
.story-grid > div:first-child > span,
.process-copy > span,
.safe-seo-section > .section-shell > div:first-child > span,
.credit-pricing > div:first-child > span,
.performance-cta > div > span {
  font-size: var(--pz-kicker-text);
  line-height: 1.35;
  letter-spacing: 1.25px;
}

/* Contenu public : aucune information utile en micro-texte. */
.feature-card h3,
.steps-grid h3,
.values-section h2,
.pricing-card .plan-name,
.safe-grid b,
.quick-help a b,
.faq-layout aside > div span,
.privacy-summary b {
  font-size: var(--pz-card-title);
  line-height: 1.35;
}

.feature-card > p,
.steps-grid p,
.market-copy li small,
.pricing-card > p,
.pricing-card li,
.credit-pricing p,
.safe-grid p,
.values-section p,
.about-score p,
.quick-help a small,
.privacy-summary p,
.legal-warning p {
  font-size: var(--pz-small-text);
  line-height: 1.6;
}

.pricing-card li {
  margin: 13px 0;
}

.plan-price span,
.monthly-equivalent,
.plan-limits span,
.popular-label,
.credit-packs span,
.credit-packs em,
.process-visual span,
.about-score small,
.about-score em,
.legal-content > small,
.faq-layout > aside > b,
.faq-layout > aside > a,
.faq-layout aside > div p,
.faq-layout aside > div a,
.contact-method b,
.contact-method a,
.contact-method span {
  font-size: 12px;
  line-height: 1.45;
}

.footer-grid > div:first-child p,
.footer-grid b,
.footer-grid a:not(.logo),
.footer-bottom {
  font-size: 13px;
  line-height: 1.55;
}

/* Formulaires publics et authentification. */
.contact-form label,
.auth-form label {
  font-size: 14px;
  line-height: 1.45;
}

.contact-form input:not([type="checkbox"]),
.contact-form select,
.contact-form textarea,
.auth-form input,
.auth-form select,
.auth-form textarea {
  min-height: 48px;
  font-size: 16px;
}

.contact-consent,
.remember,
.password-hint,
.auth-switch,
.auth-back {
  font-size: 13px;
  line-height: 1.5;
}

.faq-list button,
.faq-list summary {
  font-size: 16px;
  line-height: 1.4;
}

.legal-content h2 {
  font-size: 21px;
  line-height: 1.3;
}

/* Espace membre : taille stable d'une page à l'autre. */
.member-main {
  font-size: var(--pz-body-text);
}

.member-main p,
.panel-title p,
.authority-score p,
.health-card > p,
.history-empty p,
.performance-cta p,
.integration-card > p,
.form-panel-head p,
.verify-head p,
.exchange-proposal p,
.notification-list p {
  font-size: 14px;
  line-height: 1.58;
}

.member-side nav a,
.member-search,
.member-search input,
.user-chip b,
.integration-card form label,
.site-form label,
.filter-panel label,
.tabs a,
th,
td {
  font-size: 14px;
}

.user-chip small,
.member-search kbd,
.domain-identity span,
.domain-bar > a,
.domain-score > span,
.domain-score > em,
.data-quality span,
.data-quality b,
.seo-summary-grid article > div > small,
.gsc-metrics span,
.impact-list span,
.timeline-events span,
.timeline-events small,
.connected-row span,
.integration-card label small,
.notification-list time,
.member-footer span,
.member-footer a,
.member-footer small {
  font-size: 12px;
  line-height: 1.45;
}

.seo-summary-grid article > div > span,
.hero-score-card > div:last-child > span,
.connected-badge,
.status-pill,
.match-tag,
.theme-tag,
.period-tabs a {
  font-size: 12px;
}

.hero-score-card h2,
.history-empty b,
.opp-head b,
.sites-grid h2,
.market-card-grid h2,
.exchange-sites b,
.notification-list b,
.impact-list b,
.timeline-events b {
  font-size: 16px;
  line-height: 1.4;
}

.hero-score-card p {
  font-size: 13px;
}

.integration-card input,
.integration-card select,
.site-form input,
.site-form select,
.site-form textarea,
.filter-panel input,
.filter-panel select {
  min-height: 48px;
  font-size: 16px;
}

.button,
.outline-button,
.outline-cta,
.audit-button,
.integration-card .button,
.exchange-actions button {
  font-size: 14px;
  line-height: 1.25;
}

.market-hero {
  align-items: end;
}

/* Mobile : mêmes repères visuels, sans réduction excessive. */
@media (max-width: 780px) {
  :root {
    --pz-page-title: 28px;
    --pz-section-title: 22px;
    --pz-card-title: 17px;
    --pz-body-text: 15px;
    --pz-small-text: 13px;
  }

  .subpage-hero {
    padding: 46px 0 62px;
  }

  .subpage-hero h1 em {
    display: inline;
  }

  .hero h1,
  .subpage-hero h1,
  .market-hero h1,
  .auth-brand h1,
  .dash-welcome h1 {
    letter-spacing: -.8px;
  }

  .member-main {
    padding-top: 88px;
  }

  .panel-title h2,
  .integration-head h2 {
    font-size: 20px;
  }

  .footer-grid b,
  .footer-grid a:not(.logo),
  .footer-grid > div:first-child p,
  .footer-bottom {
    font-size: 13px;
  }
}
