body {
      transition: background 0.3s, color 0.3s;
    }

    @media (max-width: 991.98px) {
      .navbar-collapse {
        border-radius: 16px;
        margin-top: 10px;
        padding: 16px;
        box-shadow: 0 10px 30px rgba(0,0,0,0.3);
      }

      .navbar-nav .nav-link {
        padding: 10px 0;
        font-size: 1.05rem;
      }

      .dropdown-menu {
        text-align: center;
      }
    }

    .hero {
      padding-top: 120px;
      padding-bottom: 60px;
    }

    .theme-toggle {
      cursor: pointer;
    }

    @keyframes shake-soft {
      0%   { transform: rotate(0deg); }
      20%  { transform: rotate(1deg); }
      40%  { transform: rotate(-1deg); }
      60%  { transform: rotate(0.8deg); }
      80%  { transform: rotate(-0.8deg); }
      100% { transform: rotate(0deg); }
    }

    .hover-shake {
      display: inline-block;
      transform: rotate(12deg);
      transition: transform 0.3s ease;
      animation: none;
    }

    .hover-shake:hover {
      animation: shake-soft 0.6s ease-in-out;
    }

    .rotate-12 {
      transform: rotate(12deg);
    }

    .no-js .requires-js {
      display: none !important;
    }

    .js .js-hidden {
      display: none !important;
    }