/* Blog articles grid (ported from Next.js) */
.blog-articles-section .grid{display: grid;grid-template-columns: repeat(3, 1fr);column-gap: 10px;row-gap: 30px;}
.blog-articles-section .blogArticleCard{background: white;background-image: url("../images/blog-bg.png");background-size: cover;background-position: center;background-repeat: no-repeat;border-radius: 12px;overflow: hidden;transition: all 0.3s ease;cursor: pointer;max-width: 480px;min-width: 280px;height: 620px;padding: 24px;position: relative;width: 100%;box-sizing: border-box;}
.blog-articles-section .blogArticleCardLink{display: block;text-decoration: none;color: inherit;}
.blog-articles-section .blogArticleCard:hover{background-color: #ebf4ff;background-image: none;}
.blog-articles-section .blogArticleCard > *{position: relative;z-index: 2;}
.blog-articles-section .blogArticleImageWrapper{width: 100%;height: 340px;border-radius: 8px;overflow: hidden;margin-bottom: 16px;background-color: #f5f5f5;}
.blog-articles-section .blogArticleImage{width: 100%;height: 100%;object-fit: cover;}
.blog-articles-section .blogArticleTitle{font-size: 28px;font-weight: 500;font-family: 'P22 Mackinac Pro';color: #333f5b;line-height: 1.3;display: -webkit-box;-webkit-line-clamp: 2;line-clamp: 2;-webkit-box-orient: vertical;overflow: hidden;text-overflow: ellipsis;margin-bottom: 12px;}
.blog-articles-section .blogArticleExcerpt{font-family: var(--font-pp-neue-montreal);font-size: 16px;font-weight: 400;color: #666;margin-bottom: 20px;display: -webkit-box;-webkit-line-clamp: 3;line-clamp: 3;-webkit-box-orient: vertical;overflow: hidden;}
.blog-articles-section .blogArticleFooter{position: absolute;bottom: 24px;display: flex;justify-content: space-between;align-items: center;}
.blog-articles-section .blogArticleReadMore{display: inline-flex;align-items: center;gap: 6px;background: none;border: none;color: var(--primary);font-family: var(--font-pp-neue-montreal);font-size: 14px;font-weight: 500;cursor: pointer;padding: 4px 0;transition: all 0.3s ease;text-decoration: none;width: fit-content;}
.blog-articles-section .blogArticleReadMore:hover{color: #3495ff;}
.blog-articles-section .blogArticleReadMoreIcon{flex-shrink: 0;transition: transform 0.3s ease;filter: brightness(0) saturate(100%) invert(20%) sepia(15%) saturate(1019%) hue-rotate(181deg) brightness(94%) contrast(89%);}
.blog-articles-section .blogArticleReadMore:hover .blogArticleReadMoreIcon{transform: translateX(2px);filter: brightness(0) saturate(100%) invert(39%) sepia(83%) saturate(749%) hue-rotate(203deg) brightness(92%) contrast(101%);}
.blog-articles-section .blogArticleCard:hover .blogArticleReadMore{color: #3495ff;transform: translateX(4px);}
.blog-articles-section .blogArticleCard:hover .blogArticleReadMore .blogArticleReadMoreIcon{transform: translateX(2px);filter: brightness(0) saturate(100%) invert(39%) sepia(83%) saturate(749%) hue-rotate(203deg) brightness(92%) contrast(101%);}
.blog-articles-section .blogPagination{display: flex;align-items: center;justify-content: center;gap: 8px;margin-top: 60px;padding: 0 20px;}
.blog-articles-section .blogPagination .navButton{display: flex;align-items: center;gap: 8px;padding: 12px 16px;background: white;border: 1px solid #e5e7eb;border-radius: 8px;color: var(--primary);font-family: var(--font-pp-neue-montreal);font-size: 14px;font-weight: 500;cursor: pointer;transition: all 0.2s ease;min-height: 44px;text-decoration: none;}
.blog-articles-section .blogPagination .navButton:hover:not(.disabled){background-color: #f9fafb;border-color: #d1d5db;transform: translateY(-1px);}
.blog-articles-section .blogPagination .navButton.disabled{opacity: 0.5;cursor: not-allowed;pointer-events: none;}
.blog-articles-section .blogPagination .navText{font-family: var(--font-pp-neue-montreal);font-size: 14px;font-weight: 500;}
.blog-articles-section .blogPagination .pageNumbers{display: flex;align-items: center;gap: 10px;margin: 0 16px;}
.blog-articles-section .blogPagination .pageButton{display: flex;align-items: center;justify-content: center;width: 44px;height: 44px;background: white;border: 1px solid #e5e7eb;border-radius: 8px;color: var(--primary);font-family: var(--font-pp-neue-montreal);font-size: 14px;font-weight: 500;cursor: pointer;transition: all 0.2s ease;text-decoration: none;}
.blog-articles-section .blogPagination .pageButton:hover{background-color: #f9fafb;border-color: #d1d5db;transform: translateY(-1px);}
.blog-articles-section .blogPagination .pageButton.active{background-color: var(--primary);border-color: var(--primary);color: white;}
.blog-articles-section .blogPagination .pageButton.active:hover{background-color: #2d3748;border-color: #2d3748;transform: translateY(-1px);}
.blog-articles-section .blogPagination .ellipsis{display: flex;align-items: center;justify-content: center;width: 44px;height: 44px;color: #6b7280;font-family: var(--font-pp-neue-montreal);font-size: 14px;font-weight: 500;}

@media (max-width: 640px) {
  .blog-articles-section .blogPagination{gap: 10px;margin-top: 40px;padding: 0 16px;flex-wrap: wrap;justify-content: center;}
  .blog-articles-section .blogPagination .navButton{padding: 8px 10px;min-height: 36px;border-radius: 6px;}
  .blog-articles-section .blogPagination .navText{display: none;}
  .blog-articles-section .blogPagination .pageNumbers{margin: 0 6px;gap: 10px;flex-wrap: wrap;justify-content: center;}
  .blog-articles-section .blogPagination .pageButton, .blog-articles-section .blogPagination .ellipsis{width: 36px;height: 36px;font-size: 12px;border-radius: 6px;}
  .blog-articles-section .blogPagination .pageButton{min-width: 36px;}
  .blog-articles-section .grid{grid-template-columns: 1fr;gap: 24px;justify-items: stretch;}
  .blog-articles-section .blogArticleCard{padding: 20px;min-width: 250px;height: 500px;border-radius: 10px;}
  .blog-articles-section .blogArticleImageWrapper{height: 300px;margin-bottom: 12px;border-radius: 6px;}
  .blog-articles-section .blogArticleTitle{font-size: 18px;line-height: 1.35;margin-bottom: 10px;}
  .blog-articles-section .blogArticleExcerpt{font-size: 13px;line-height: 1.4;margin-bottom: 16px;-webkit-line-clamp: 2;line-clamp: 2;}
}

@media (min-width: 641px) and (max-width: 1024px) {
  .blog-articles-section .blogPagination{margin-top: 50px;gap: 6px;}
  .blog-articles-section .blogPagination .navButton{padding: 10px 14px;min-height: 40px;}
  .blog-articles-section .blogPagination .pageNumbers{margin: 0 12px;gap: 10px;}
  .blog-articles-section .blogPagination .pageButton, .blog-articles-section .blogPagination .ellipsis{width: 40px;height: 40px;font-size: 13px;}
  .blog-articles-section .grid{grid-template-columns: repeat(2, 1fr);}
  .blog-articles-section .blogArticleCard{padding: 22px;min-width: 320px;height: 550px;}
  .blog-articles-section .blogArticleImageWrapper{height: 300px;margin-bottom: 14px;}
  .blog-articles-section .blogArticleTitle{font-size: 19px;}
  .blog-articles-section .blogArticleExcerpt{font-size: 14px;}
}

@media (min-width: 1025px) and (max-width: 1366px) {
  .blog-articles-section .blogPagination{margin-top: 55px;}
}

@media (min-width: 1367px) {
  .blog-articles-section .blogPagination{margin-top: 60px;gap: 10px;}
  .blog-articles-section .blogPagination .navButton{padding: 14px 18px;min-height: 48px;}
  .blog-articles-section .blogPagination .pageNumbers{margin: 0 20px;gap: 15px;}
  .blog-articles-section .blogPagination .pageButton, .blog-articles-section .blogPagination .ellipsis{width: 48px;height: 48px;font-size: 15px;}
}