/* Font setup */
body {
    font-family: 'Inter', sans-serif;
    padding-bottom: 60px;
  }
  
  /* ========================
     Fade In Up Animation
     ======================== */
  .fade-in-up {
    opacity: 0;
    transform: translateY(20px);
    animation-fill-mode: forwards;
    animation-name: fadeInUp;
    animation-duration: 0.8s;
    animation-timing-function: ease-out;
  }
  
  .fade-in-up.delay-100 { animation-delay: 0.1s; }
  .fade-in-up.delay-200 { animation-delay: 0.2s; }
  .fade-in-up.delay-300 { animation-delay: 0.3s; }
  .fade-in-up.delay-400 { animation-delay: 0.4s; }
  .fade-in-up.delay-500 { animation-delay: 0.5s; }
  
  @keyframes fadeInUp {
    to {
      opacity: 1;
      transform: translateY(0);
    }
  }
  
  /* ========================
     Button Styles
     ======================== */
  .btn-primary {
    background-color: #2563eb; /* blue-600 */
    color: #fff;
    font-weight: 600;
    border-radius: 0.5rem;
    padding: 0.75rem 1.5rem;
    transition: all 0.3s ease-in-out;
    display: inline-block;
  }
  
  .btn-primary:hover {
    background-color: #f97316; /* orange-500 */
    box-shadow: 0 10px 15px -3px rgba(0,0,0,0.1),
                0 4px 6px -2px rgba(0,0,0,0.05);
  }
  
  /* ========================
     Navigation Links
     ======================== */
  .nav-link {
    position: relative;
    transition: color 0.3s ease;
  }
  
  .nav-link::after {
    content: '';
    position: absolute;
    width: 0;
    height: 2px;
    bottom: -4px;
    left: 0;
    background-color: #f97316; /* orange-500 */
    transition: width 0.3s ease;
  }
  
  .nav-link:hover::after,
  .nav-link:focus::after {
    width: 100%;
  }

  .prose {
    font-size: 1.125rem; /* ~18px */
    line-height: 1.8;    /* thoáng hơn */
  }
  
  .prose p {
    margin-bottom: 1.25rem; /* cách dòng dưới */
  }
  
  .prose h2 {
    font-size: 1.75rem;   /* ~28px */
    font-weight: 700;
    margin-top: 2.5rem;
    margin-bottom: 1rem;
    color: #1d4ed8; /* xanh đậm */
  }
  
  .prose h3 {
    font-size: 1.5rem;   /* ~24px */
    font-weight: 600;
    margin-top: 2rem;
    margin-bottom: 0.75rem;
    color: #2563eb;
  }
  
  .prose ul, .prose ol {
    margin-left: 1.5rem;
    margin-bottom: 1.25rem;
  }
  
  .prose li {
    margin-bottom: 0.5rem;
  }
  
  .site-footer {
    position: fixed;   /* cố định */
    bottom: 0;         /* sát đáy màn hình */
    left: 0;
    width: 100%;       /* full chiều ngang */
    background: #0057ff; /* màu xanh của bạn */
    color: #fff;
    text-align: center;
    padding: 15px;
    z-index: 999;      /* tránh bị che */
  }