Большое —
в деталях.

.page {
  --unit: calc(100vw / 1920);
  padding: calc(80 * var(--unit));
}

.title {
  font-size: clamp(32px, 4.2vw, 80px);
}

@media (max-width: 600px) {
  .page { padding: 20px; }
}

<SiteLayout>
  <Header navigation={navigation} />
  <main>{children}</main>
  <Footer contacts={contacts} />
</SiteLayout>

<title>AQ Institute — адаптивный интеллект</title>
<meta name="description"
  content="Исследования, материалы и события института."
/>
<link rel="canonical"
  href="https://aqinstitute.ru/"
/>

const visible = projects.filter(
  project => category === 'Все'
    || project.category === category
);

return visible.map(project => (
  <ProjectCard key={project.id}
    project={project} />
));

<title>Альфаматика — решения для автоматизации</title>
<meta name="description"
  content="Технологии и оборудование для вашего бизнеса."
/>
<link rel="canonical"
  href="https://alphamatica.ru/"
/>