/* Typographie et contrastes renforcés pour les textes de lecture et de repère. */
body { font-size: 16px; }

.hero-intro,
.tech-copy > p,
.journey-copy > p:not(.journey-date):not(.journey-quote),
.contact-description,
.footer-identity > p {
  font-size: 15px;
  line-height: 1.75;
}

.eyebrow,
.hero-meta,
.visual-index,
.slot-note,
.scroll-cue,
.section-index,
.project-tech,
.social-title,
.languages,
.footer-bottom,
.concept-kicker,
.fiction-note,
.contact-pretitle,
.contact-unavailable,
.journey-date,
.footer-topline,
.footer-nav > p,
.footer-networks > p,
.footer-bottom .back-top,
.concept-details small,
.lightbox figcaption {
  font-size: 11px;
}

.eyebrow,
.hero-meta,
.visual-index,
.slot-note,
.section-index,
.social-title,
.languages,
.footer-bottom,
.fiction-note,
.contact-unavailable,
.journey-date,
.footer-topline,
.footer-nav > p,
.footer-networks > p,
.concept-details small {
  color: #53655A;
}

.hero .eyebrow,
.hero .hero-meta,
.hero .visual-index,
.hero .slot-note,
.section-contact .social-title,
.section-contact .languages,
.section-contact .contact-unavailable {
  color: #D1DDD5;
}

.section-index { color: #52645A; }
.hero .section-index { color: #D1DDD5; }

.dropdown-panel p,
.dropdown-panel a span,
.social-list small,
.footer-social-empty small {
  font-size: 11px;
}

.hero-claim { font-size: clamp(22px, 2.2vw, 29px); }
.button,
.hero-actions .button,
.footer-contact-link,
.footer-nav > a { font-size: 13px; }

@media (max-width: 680px) {
  .eyebrow { font-size: 11px; line-height: 1.5; }
  .hero-meta { font-size: 10px; gap: 8px; }
  .visual-index,
  .slot-note { font-size: 10px; }
  .hero-intro,
  .tech-copy > p,
  .journey-copy > p:not(.journey-date):not(.journey-quote),
  .contact-description { font-size: 14px; }
  .section-index,
  .section-tag,
  .journey-date,
  .fiction-note,
  .concept-kicker,
  .contact-pretitle,
  .contact-unavailable,
  .languages,
  .footer-topline,
  .footer-bottom,
  .footer-nav > p,
  .footer-networks > p,
  .concept-details small,
  .lightbox figcaption { font-size: 10px; }
  .tech-list li,
  .course-tags span { font-size: 11px; }
  .project-tech,
  .social-list small { font-size: 11px; }
  .concept-card > span,
  .empty-note,
  .footer-nav > a,
  .footer-social-list a,
  .footer-social-empty { font-size: 12px; }
  .footer-contact-link { font-size: 13px; }
}

/* Signature typographique du header. */
.brand-name {
  display: inline-flex;
  align-items: baseline;
  gap: 6px;
  font-family: var(--display), sans-serif;
  font-size: 24px;
  line-height: 1;
  letter-spacing: -0.065em;
  color: #FFFFFF;
  transition: color 180ms ease;
}

.brand-first {
  color: inherit;
  font: inherit;
  font-weight: 600;
}

.brand-name strong {
  color: inherit;
  font: inherit;
  font-weight: 400;
  transition: color 180ms ease;
}

.site-header:not(.is-scrolled) .brand-name,
.site-header:not(.is-scrolled) .brand-name strong,
.site-header:not(.is-scrolled) .brand-first {
  color: #FFFFFF;
}

.site-header.is-scrolled .brand-name { color: #20362A; }
.site-header.is-scrolled .brand-name strong { color: inherit; }

@media (max-width: 680px) {
  .brand-name { gap: 5px; font-size: 21px; }
}
