@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:wght@400;500;600;700&family=Inter:wght@400;500;600;700&family=Manrope:wght@500;600;700;800&family=Source+Serif+4:opsz,wght@8..60,400;500;600;700&display=optional');
@import url('./spacing-system.css?v=20260905-1');

:root {
  --font-ui: 'Manrope', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --font-body: 'Inter', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --font-editorial: 'Source Serif 4', Georgia, 'Times New Roman', serif;
  --font-technical: 'IBM Plex Mono', 'SFMono-Regular', Consolas, 'Liberation Mono', monospace;
}

html body {
  font-family: var(--font-body) !important;
  font-kerning: normal;
  text-rendering: optimizeLegibility;
}

html body p,
html body li,
html body dd,
html body dt,
html body table,
html body thead,
html body tbody,
html body tfoot,
html body th,
html body td,
html body input,
html body textarea,
html body select,
html body option,
html body .section-description,
html body .page-description,
html body .hero-description,
html body .home-hero-v2__description,
html body .home-method__intro,
html body .home-method__item p,
html body .home-contact-cta__description,
html body .timeline-card p,
html body .clean-list,
html body .project-card p,
html body .cpx-skill-desc,
html body .about-lead,
html body .about-side p,
html body .contact-intro p,
html body .resume-summary,
html body .resume-list {
  font-family: var(--font-body) !important;
  font-size: var(--ls-body-size, 1rem) !important;
}

/* Régua canônica: todo texto corrido do portfólio usa 16px. */
html body p,
html body li,
html body dd,
html body dt,
html body table,
html body thead,
html body tbody,
html body tfoot,
html body th,
html body td,
html body input,
html body textarea,
html body select,
html body option,
html body blockquote,
html body .section-description,
html body .page-description,
html body .hero-description,
html body .home-hero-v2__description,
html body .home-method__intro,
html body .home-method__item p,
html body .home-contact-cta__description,
html body .timeline-card p,
html body .clean-list,
html body .project-card p,
html body .cpx-skill-desc,
html body .about-lead,
html body .about-side p,
html body .about-how__card p,
html body .about-edu p,
html body .about-goal-card p,
html body .contact-intro p,
html body .resume-summary,
html body .resume-list,
html body .editorial-copy {
  font-size: var(--ls-body-size, 1rem) !important;
}

html body h1,
html body h2,
html body h3,
html body h4,
html body h5,
html body h6,
html body .section-title,
html body .page-title,
html body .hero-title,
html body .home-hero-v2__title,
html body .home-hero-v2__positioning,
html body .home-method__header h2,
html body .home-method__item h3,
html body .home-contact-cta__title,
html body .projects-showcase__title,
html body .cpx-title,
html body .cpx-skill-title,
html body .about-title,
html body .about-title *,
html body .about-side h2,
html body .about-objective h2,
html body .about-section-head h2,
html body .contact-title,
html body .resume-section__head h2,
html body .brand,
html body .brand-mark,
html body .nav-links,
html body .btn,
html body button,
html body .section-kicker,
html body .filter-btn,
html body .showcase-filter,
html body .tab,
html body .project-tag,
html body .chip,
html body .timeline-status,
html body .cpx-group,
html body .cpx-icon,
html body .portfolio-pillar strong,
html body .projects-showcase__cta strong {
  font-family: var(--font-ui) !important;
  font-synthesis: none;
}

html body blockquote,
html body .editorial,
html body .editorial-copy,
html body .quote-panel p,
html body .contact-title em,
html body .cpx-title em {
  font-family: var(--font-editorial) !important;
}

html body .contact-title em,
html body .cpx-title em {
  font-style: italic;
  font-weight: 500;
  letter-spacing: -0.03em;
}

html body .about-title em {
  font-family: var(--font-ui) !important;
  font-style: normal;
  font-weight: inherit;
  letter-spacing: inherit;
}

html body code,
html body pre,
html body kbd,
html body samp,
html body .technical-hud,
html body .home-hero-v2__code,
html body .home-hero-v2__profile-label,
html body .home-hero-v2__domain span,
html body .home-tech-ribbon__item,
html body .home-method__number,
html body .timeline-meta,
html body .tech-list,
html body .portfolio-pillar__index,
html body .cpx-ghost,
html body .cpx-level-badge,
html body .projects-showcase__accent,
html body .projects-showcase__meta,
html body .project-meta,
html body .resume-meta {
  font-family: var(--font-technical) !important;
}

html body button,
html body input,
html body textarea,
html body select {
  font-synthesis: none;
}

/*
  Ajuste fino da régua tipográfica canônica.
  A especificidade em html:root mantém estes tokens como fonte final de verdade,
  mesmo quando estilos de página são carregados depois.
*/
html:root {
  --ls-body-size: 1rem;
  --ls-content-width: 1460px;
  --ls-page-gutter: 24px;
  --ls-tag-size: .66rem;
  --ls-control-text-size: .875rem;
  --ls-page-title-size: clamp(2.05rem, 2.45vw, 2.35rem);
  --ls-page-description-size: 1rem;
  --ls-section-title-size: 1.52rem;
  --ls-card-title-size: 1.05rem;
  --ls-card-body-size: 1rem;
  --ls-label-size: .78rem;
  --ls-small-size: .72rem;
  --ls-body-line-height: 1.66;
}

/* O nome na abertura continua sendo display de marca, porém mais equilibrado. */
html body.home-page-v2 main .home-hero-v2__title {
  font-size: clamp(4.1rem, 7vw, 6.8rem) !important;
  line-height: .88 !important;
  letter-spacing: -.067em !important;
}

/*
  Alinhamento vertical canônico da abertura.
  O selo PORTFÓLIO começa na mesma altura visual dos kickers das páginas internas,
  como SOBRE MIM, em vez de ficar centralizado pela altura do bloco da foto.
*/
html body.home-page-v2 main .home-hero-v2 {
  padding-top: var(--ls-internal-page-start, clamp(52px, 4.5vw, 68px)) !important;
}

html body.home-page-v2 main .home-hero-v2__content {
  align-self: start !important;
}

@media (max-width: 640px) {
  html:root {
    --ls-page-gutter: 14px;
    --ls-page-title-size: 1.95rem;
    --ls-page-description-size: 1rem;
    --ls-section-title-size: 1.4rem;
    --ls-card-title-size: 1.03rem;
    --ls-card-body-size: 1rem;
  }

  html body.home-page-v2 main .home-hero-v2__title {
    font-size: clamp(3.35rem, 15vw, 4.6rem) !important;
  }

  html body.home-page-v2 main .home-hero-v2 {
    padding-top: var(--ls-internal-page-start-mobile, 42px) !important;
  }
}

/*
  MANROPE: UI + headings
  INTER: body + data
  SOURCE SERIF 4: editorial
  IBM PLEX MONO: technical HUD
*/
