/* AI4E Tech Blog — Custom Styles (served as static file) */

@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('/fonts/inter-latin.woff2') format('woff2');
}

@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('/fonts/inter-latin-700.woff2') format('woff2');
}

@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 900;
  font-display: swap;
  src: url('/fonts/inter-latin-900.woff2') format('woff2');
}

body, html, nav, header, footer, article, article * {
  font-family: 'Inter', ui-sans-serif, system-ui, -apple-system, sans-serif !important;
}

article[data-pagefind-body],
article[data-pagefind-body] p,
article[data-pagefind-body] li,
article[data-pagefind-body] blockquote,
article[data-pagefind-body] td {
  font-size: 1.05rem !important;
  line-height: 1.78 !important;
  letter-spacing: -0.01em !important;
}

@media (min-width: 769px) {
  article[data-pagefind-body],
  article[data-pagefind-body] p,
  article[data-pagefind-body] li,
  article[data-pagefind-body] blockquote,
  article[data-pagefind-body] td {
    font-size: 1.1rem !important;
    line-height: 1.8 !important;
  }
}

article[data-pagefind-body] h2 {
  font-weight: 700 !important;
  letter-spacing: -0.02em;
  margin-top: 2.5em;
  padding-bottom: 0.3em;
  border-bottom: 1px solid rgba(128, 128, 128, 0.15);
}

article[data-pagefind-body] h3 {
  font-weight: 600 !important;
  letter-spacing: -0.01em;
}

article[data-pagefind-body] blockquote {
  border-left: 3px solid #8b5cf6 !important;
  background: rgba(139, 92, 246, 0.04) !important;
  padding: 1em 1.5em !important;
  border-radius: 0 8px 8px 0 !important;
  font-style: normal !important;
}

html.dark article[data-pagefind-body] blockquote {
  border-left-color: #a78bfa !important;
  background: rgba(167, 139, 250, 0.06) !important;
}

article[data-pagefind-body] pre {
  border-radius: 12px !important;
  border: 1px solid rgba(128, 128, 128, 0.12) !important;
}

article[data-pagefind-body] :not(pre) > code {
  font-size: 0.9em !important;
  background: rgba(139, 92, 246, 0.08) !important;
  padding: 0.15em 0.4em !important;
  border-radius: 4px !important;
}

article[data-pagefind-body] img {
  border-radius: 12px !important;
  box-shadow: 0 4px 24px rgba(0, 0, 0, 0.08);
  margin: 2em auto !important;
}

html.dark article[data-pagefind-body] img {
  box-shadow: 0 4px 24px rgba(0, 0, 0, 0.3);
}

article[data-pagefind-body] hr {
  border-color: rgba(128, 128, 128, 0.12) !important;
  margin: 2.5em 0 !important;
}

html.dark article[data-pagefind-body] strong {
  color: #f1f5f9;
}

article[data-pagefind-body] {
  animation: fadeSlideIn 0.4s ease-out;
}

@keyframes fadeSlideIn {
  from { opacity: 0; transform: translateY(12px); }
  to { opacity: 1; transform: translateY(0); }
}